ts原生来写个极简的连连看小游戏~

ts原生来写个极简的连连看小游戏~

首页休闲益智奇怪的连连看更新时间:2024-04-18

好久没有写东西了,一直在忙工作。最近稍微闲下来了,很巧的是最近有个学计算机的学妹,她们的毕设竟然是做个小程序,她选了做个连连看小游戏,我就帮着做了个简单的。

正好这次用canvas ts 来实现以下极简的连连看

先用矩阵定义布局

1代表有图片,0代表空置

核心矩阵类

连连看主要逻辑:

  1. 只有内容相同的图片才有消除的可能
  2. 每次只能消除两张图片,消除时需要使用鼠标指定(即连接)
  3. 两张图片连接时所经过的路径(连接路径)不能超过两个拐点
  4. 连接路径经过的单元格所包含的图片必须已经消除

0折连接

1折连接

2折连接

算法我看过了很多大神写的,借鉴了不少。

引入布局和矩阵类,定义画布和属性

定义图片精灵类

背景类

游戏主体,存放图片二维矩阵

绑定鼠标点击事件

消除图片,60帧刷新画布

最后调用运行

运行效果

Github地址:

https://github.com/Reborn233/ts-game/blob/master/src/game/link.ts

查看全文
大家还看了
也许喜欢
更多游戏

Copyright © 2024 妖气游戏网 www.17u1u.com All Rights Reserved