如何做一个泡泡龙游戏(一)

简介: 嗨!大家好,我是小蚂蚁。从今天开始,我将会用几篇文章讲一下如何制作一个泡泡龙游戏,泡泡龙是一个传统经典的消除游戏,也是一个经久不衰永不过时的游戏。这篇文章我们主要来了解一下如何设置泡泡龙游戏的初始布局。

嗨!大家好,我是小蚂蚁。从今天开始,我将会用几篇文章讲一下如何制作一个泡泡龙游戏,泡泡龙是一个传统经典的消除游戏,也是一个经久不衰永不过时的游戏。


这篇文章我们主要来了解一下如何设置泡泡龙游戏的初始布局。


640.png


如图,是一个泡泡龙游戏的布局,可以发现它跟其他的消除类游戏还是有一些不同之处的。在其他的消除游戏中,行和列通常都是规则的,例如 1010 游戏中 10 行 10 列的布局。但是在泡泡龙游戏中,不是规则的,比如说第 1 行有 5 列,第 2 行有 4 列,第 3 行 5 列,第 4 行 4 列.....


虽然,是不规则的,但还是有一定的规律的,就是 1,3,5 的奇数行比 2,4,6 的偶数行多出一列。


要创建一个泡泡龙游戏的布局,其实就是需要根据当前的行号列号去设置每个泡泡的位置,之前在消除游戏系列教程中已有讲过,这里我们就跳过一些琐碎的步骤,直接跳到推导结果。


640.png


如图,这里是一个重点的地方,即行间距如何计算,从排列图中可以看到,第二行的圆跟第一行的圆之间是有一定的交叉的,所以第二行和第一行的距离并不等于圆的直径。那行间距到底是什么呢?注意看图中标注出的那个直角三角形,第二行和第一行的间距其实就是这个直角三角形的较长的直角边的长度


还记得曾经学过的与直角三角形有关的三角函数吗?什么?早就还给老师了。没关系,可以去先查一下,我就是用到的时候现查的,没什么不好意思的。


这里我们其实已知的是斜边的长度,即一个圆的直径,另外也知道上方的角度是30度,计算长的直角边的长度,这里用到的是余弦函数,已知斜边的长度和角度,可以计算出直角边的长度。


接着,我们来看一下已知条件,以及最终的结果计算公式。


640.png


这里需要注意的是,在计算水平方向的 x 坐标时,需要根据当前所在的是奇数行还是偶数行使用不同的计算方式。


在掌握了理论基础之后,接下来只需要使用相应的逻辑来完成这个计算就好了。


首先,我们来布置一下场景。


640.png


非常的简单,只有背景,一个“泡泡”和一个“初始化泡泡”(我们把克隆泡泡的逻辑放在这上面)。


接着,创建一些全局变量,用于后续使用。


640.png


可以看到这里泡泡的直径,行数,列数,起点的位置x,y,都是已经的条件。


接着,来看一下“初始化泡泡”上的克隆泡泡的逻辑。


640.png


使用一个双重循环一行一行的克隆泡泡,这里需要注意的是奇数行偶数行的区别,偶数行创建的泡泡数量要比列数少一,这里我们使用了取余 2 的计算来判断是奇数行还是偶数行(什么?不知道什么是取余计算?快点儿去查一下)。


最后,来看一下“泡泡”上的逻辑积木。


640.png


就是根据我们上方的推导公式计算并设置泡泡的 x 坐标和 y 坐标。这里注意一下,奇数行偶数行的x坐标的计算公式有差异。


预览一下场景。


640.png


这样,我们就创建了一个 6 行 6 列的泡泡龙游戏初始化的布局了。


在所有的消除游戏里都存在这样一个过程,即正向推导逆向推导。上方我们讲过的这一系列过程就是正向推导,我们根据一个泡泡的行号列号推算出了它游戏界面上的位置(即游戏世界坐标系中的 x 和 y 坐标)。


接下来,我们来看一下逆向推导,即已知当前游戏世界坐标系中的一个点的 x 和 y 坐标,推算出当前点击的这个泡泡的行号列号


640.png


推算公式在这里了,主要有两点儿需要注意的地方,第一个是在计算列号时,奇数行偶数行的计算公式不同。另一个是用到了四舍五入,保证了只要这个坐标位置位于这个圆的区域之内,那么它就是位于这个圆上。

建议你在纸上把图画出来,然后对照着公式去带入理解,验证。每次涉及到计算时我都会使用这种方法,而且屡试不爽。

现在理论具备了,接下来我们就在游戏中实现一下这个逆向推导过程,我们实现一个这样的示例:任意点击某个泡泡,然后根据当前点击的位置,推算出当前点击的是哪个泡泡。


这是加在背景上的积木逻辑。


640.png


虽然看起来很长,但是其实很简单。就是根据当前手指在屏幕上点击位置的 x,y 坐标,推导出泡泡的行号列号,最后向所有的泡泡发送一个通知。


最后,再来看一下泡泡的完整积木逻辑。


640.png


在克隆泡泡时,我们使用两个局部变量(行号列号),记录当前泡泡的位置,然后在接收到“动一下”通知时,用这两个变量来判断当前点击的是否是自己,是的话就“弹出”一下。


最后,我们来预览一下。


640.gif


点击哪个泡泡,这个泡泡就会动一下。注意,这里当我们点击一个泡泡时,整个过程是这样的:根据当前点击位置的 x,y 坐标,计算出当前点击的时哪一行哪一列的泡泡,然后给所有的泡泡发送了一个“动起来”的通知,接到通知后,行号列号都等于计算出的行号列号的那个泡泡,会自己动一下。


好了,今天的内容就到这里了,我们学习了一下泡泡游戏的初始布局如何设置,然后了解了正向推导逆向推导的过程。如果你看过我之前写的与消除游戏有关的教程,大概就能看出来,在所有的消除类型的游戏中,有些东西是相通的,例如初始的布局正向推导,逆向推导的过程,对于泡泡龙这个消除游戏来讲只不过是稍有差异而已。


理解这些东西最难的地方或许就是那几个数学计算公式,见过很多人一提到数学公式就头大。其实完全没有必要,这些数学计算其实并不复杂,最多不过初中的数学知识,而且即使你全忘光了也没什么关系,完全可以在用到的时候搜索一下某个公式是什么意思,就可以了。


真正让你头大的其实并不是这些数学知识有多难,而是因为你从未尝试过好好的坐下来,拿出一张纸,画出一个图,然后慢慢的分析和理解。


相信我,这并不是浪费时间,所有的消除类型的游戏中有一些东西是完全相通的,只要你深刻的理解并搞清楚一个,以后就会一通百通了。


有的时候一件时间把我们难倒并不是因为这件事情本身太难了,而是因为我们太懒了。


我是会做游戏也会教你做游戏的小蚂蚁,想学习做游戏的话,关注我的公众号就对啦!

相关文章
|
存储 Cloud Native API
oss云网关配置
配置阿里云OSS与云网关实现灵活数据传输和访问控制。步骤包括开通OSS服务,创建Bucket,获取访问凭证,可选配置CORS和生命周期规则。云网关配置涉及阿里云云原生网关的代理规则设定或使用云存储网关集成OSS访问,具体配置需参照产品文档,因产品更新可能会有变动。
905 1
|
6月前
|
安全 Linux Android开发
Cisco Secure Client 5.1.12.146 发布,新增功能简介
Cisco Secure Client 5.1.12.146 发布,新增功能简介
444 5
Cisco Secure Client 5.1.12.146 发布,新增功能简介
|
10月前
|
人工智能 供应链 安全
实现企业级 MCP 服务统一管理和智能检索的实践。
本文将深入剖析 MCP Server 的五种主流架构模式,并结合 Nacos 服务治理框架,为企业级 MCP 部署提供实用指南。
712 130
|
9月前
|
人工智能 自然语言处理 数据可视化
阿里云连续6年入选Gartner® ABI魔力象限报告,中国唯一
Gartner®发布2025年《分析与商业智能平台魔力象限》报告。报告显示,阿里云凭借其核心数据分析产品 Quick BI 入选该报告“挑战者”象限,这也是阿里云连续六年入选Gartner ABI魔力象限报告。
Vue3分割线(Divider)
这是一个可定制的分割线组件,支持多种属性设置,包括标题位置、边距、宽度、样式、颜色及垂直分割等。通过简单的配置即可实现多样化的视觉效果,适用于不同场景下的布局需求。在线预览和详细代码示例可见链接。
746 5
Vue3分割线(Divider)
|
网络协议 Unix 网络安全
FTP服务器怎么搭建?Windows server搭建FPT服务器
FTP服务器是按照FTP协议提供文件传输服务的计算机。它用于在两台计算机间安全地传输文件,支持用户权限管理和跨平台操作。FTP使用控制连接处理命令,数据连接传输文件,有PORT和PASV模式。要搭建FTP服务器,首先在Windows Server 2008 R2上安装IIS,确保选中FTP服务。接着,创建FTP文件夹作为站点根目录,通过IIS管理器添加FTP站点,配置站点信息、身份验证和权限。测试客户端通过telnet和浏览器访问FTP服务器,确认能成功登录及浏览文件。FTP常用于文件共享和管理,可通过专用工具如FlashFXP上传下载文件。
775 0
FTP服务器怎么搭建?Windows server搭建FPT服务器
|
前端开发
【UI】 elementui的dialog弹窗打开时CSS的BUG | 滚动条消失bug
【UI】 elementui的dialog弹窗打开时CSS的BUG | 滚动条消失bug
797 0
|
算法
点消游戏查找算法的原理和实现
点消游戏查找算法的原理和实现
491 0
|
开发者
泡泡龙游戏开发实战教程(8):完整流程
泡泡龙游戏开发实战教程(8):完整流程
529 0
|
搜索推荐
idea的自定义模板(文件代码模板和文件注释说明文档)
idea的自定义模板(文件代码模板和文件注释说明文档)
634 0
idea的自定义模板(文件代码模板和文件注释说明文档)
下一篇
开通oss服务