碰撞球(连连看)游戏 连连看匹配算法分析与实现思路
本文由发表于5年前 | 游戏开发 | 暂无评论 |  被围观 4,450 views+
1、两个图片相邻的情况:2、两条连线的情况:3、三条连线的情况:

前段时间空闲之余制作了一个基于Javascripit和HTML5的canvas面板的碰撞球连连看小游戏,游戏地址:点击IT宅桌面中的碰撞球图标即可。

连连看涉及到的算法也不是很复杂,这里我主要是分为三种情况去分析,下面逐个分析。

首先是初始化连连看数组,把所有的图片看成是一个二维数组,有图片的地方置1,没有图片的地方置0。

1、两个图片相邻的情况:

这种情况下,我们只需要把两个图片的x坐标和y坐标分别相减并取绝对值:

A = | x1 – x2 |;
B = | y1 – y2 |;

只要发现计算的A,B两个值中,有一个为0,一个为1,即表示这两个图片是相邻的。

2、两条连线的情况:

20120410-link01

如上图这种情况为图片对角,其中根据对角线的不同又可以分为两种情况,即左上角对右下角和右上角对左下角。其分析思路大致是一样的,只是细节的判断时方向可能不一样,这里我们就选择图中的左上角对右下角这种情况来分析。

1、首先如图所示,我们分别设左上角和右下角为A(x1,y1) B(x2,y2)点,这样我们可以找到其他的两个顶点的坐标C(x1,y2) D(x2,y1)。

2、判断CD两点是否无图片,即值是否为0,如果是则使用该点继续判断,否则放弃该点。如上图则C点无图,符合条件,转入下一步处理。

3、根据上一步获取到的点,判断该点分别与AB两点之间的连线上是否都不存在图片,如果不存在则表示连连看配对成功,否则,配对失败。如上图AC和BC两条连线上均没有图片,符合规则,所有AB两点配对成功。

3、三条连线的情况:

20120410-link02

如上图所示,也可以具体分为两种情况考虑,我们现在先说其中的一种。

设左边的大空翼为A,右边的大空翼为B,我们先分别查找AB两点Y轴方向包括AB两点的最大的连续没有图片的位置,我们找到了如上图所示的左右两个绿色矩形框的位置。

接着在这两个矩形框中查找Y轴方向上的公有部分如图,左右两个矩形框中的白色矩形框即为Y轴上的公有部分。

我们在这个公有部分的Y轴范围分别逐个横着扫描其中的每一条连线,查看是否有其中的一条直线中没有图片,则匹配成功。上图中,我们扫描第一条直线时就发现了一条完整的没有图片的图片,即是图中中间那个绿色矩形框。这样就匹配成功了。

而至于另外一种情况,把上图作90度旋转,作类似的操作即可判断。

除了文章中有特别说明,均为IT宅原创文章,转载请以链接形式注明出处。
本文链接:http://www.itzhai.com/collision-balls-the-lianliankan-game-lianliankan-matching-algorithm-analysis-and-realization-of-ideas.html
arthinking Java技术交流群:280755654,入门群:428693174 more
分享到:
 
2012 4/10
文章评论
    没有评论
给我留言

有人回复时邮件通知我
游戏开发的相关文章
随机文章 本月热门 热评
1 Java基础笔记 – 线程介绍及其创建的两种方法 如何退出线程 2011/10/23
2 JVM笔记 – 自动内存管理机制(Java内存区域与内存溢出异常) 2014/11/11
3 Javascript笔记 – Javascript中的原型和this指针 2012/5/22
4 数据结构笔记 – 排序算法 希尔排序算法 2011/9/21
5 Java SE 5.0以上版本中for each循环的使用 2011/6/17
6 JavaScript设计模式笔记 – 享元模式 代理模式 2012/11/21
友情推荐 更多
破博客 文官洗碗安天下,武将打怪定乾坤。多么美好的年代,思之令人泪落。
Mr.5's Life 白天是一名程序员,晚上就是个有抱负的探索者
行知-追寻技术之美 关注大数据,分布式系统
我爱编程 编程成长轨迹
Cynthia's Blog 学习笔记 知识总结 思考感悟
 
欢迎关注我的公众号 IT宅
关于IT宅 文章归档

IT宅中的文章除了标题注明转载或有特别说明的文章,均为IT宅的技术知识总结,学习笔记或随笔。如果喜欢,请使用文章下面提供的分享组件。转载请注明出处并加入文章的原链接。 感谢大家的支持。

联系我们:admin@itzhai.com

Theme by arthinking. Copyright © 2011-2015 IT宅.com 保留所有权利.