微信小游戏开发实战10-检查形状

简介: 本篇主要内容:1010游戏中的形状检查以及游戏结束的判断。如果你没有任何的游戏开发经验,欢迎阅读我的“人人都能做游戏”系列教程,它会手把手的教你做出自己的第一个小游戏。

本篇主要内容:1010游戏中的形状检查以及游戏结束的判断。

如果你没有任何的游戏开发经验,欢迎阅读我的“人人都能做游戏”系列教程,它会手把手的教你做出自己的第一个小游戏。



在“1010”游戏中,当网格中再也没有位置安放剩余的形状时,游戏就会结束。为了能够判断当前的形状是否还能够放置到网格中,我们就需要对当前的形状进行检查。


这一节,我们就来实现一下形状的检查以及游戏结束的判定。


如图,当网格中再也没有位置安放剩余的形状的时候,就是游戏结束的时候。


实现思路:每当一个形状被放置到网格中后,就需要对剩余的形状进行一遍检查,检查网格上是否还有能够放置其它形状的位置,如果有的话,则游戏可以继续进行,如果没有任何的位置可以放置剩余的形状,则游戏结束。


下面,我们先看一张图,配合着图片理解一下整个检查的过程。

假设当前网格中的布局如图上所示,“0”的位置表示空白,“1”的位置表示已经填充。我们需要检查当前的“田字”形状是否能够放置到网格中。从左下角开始一行一行的检查,首先会检查红色的框圈出的位置1的四个方块,发现位置1无法放置,接着开始向右挪动一个位置开始检查蓝色位置2的四个方块,发现位置2也无法放置,接着继续向右挪动一格检查,直到检查到位置6,仍然没有可以放置的位置。这样第一行就检查完了,然后接着从第二行开始检查,依旧没有合适的位置,接着第三行,发现第一个绿框圈出的位置可以进行放置,这样整个检查过程就结束了。剩余的位置也无需再进行检查了,因为我们已经知道网格上至少是有一个位置可以安放当前的形状,这样就足够了。


如果整个网格遍历检查完后都没有找到合适的位置,那就意味着当前的形状无效(即无法放置到网格上)。


接着我们就动手实现一下这个形状检查的功能,首先,选择“容器-1”,先为其增加几个新的“局部变量”。

“形状是否有效”来标识当前的形状是否处于“有效状态”,1表示有效,0表示无效。“当前位置是否可放形状”用于在遍历检查中记录检查的结果。“正在删除”用于标识当前的形状是否正在删除,对于正在删除的形状是没有必要进行检查的(后续会有详细解释)。


接着,增加一个新的全局变量“全局-有效形状的数量”,记录当前游戏中有多少个形状是有效的,如果当前网格中还有位置可以放置形状,则我们认为该形状有效,否则的话,该形状无效。


新增一个通知“检查形状”,每当形状的数量发生变化后,我们就发送一下这个通知,通知剩余的形状进行检查。


最后,选择“容器-1”,为其增加如下的积木块。

如图,检查的逻辑,我们在上方已经详细的讲述过。重点在于两个红框框出来的“如果”部分的逻辑,一个判定条件是要将检查范围限定在网格范围之内,一个判定条件是网格的当前位置是否已经被填充了。最后,如果形状有效的话,我们就让其正常显示,如果形状无效的话,降低其透明度,让其变暗,表示当前形状无效。


接着,我们把形状“按下”和“放开”的逻辑做一点儿调整。

如图,增加了一个判定条件,只有当形状有效时,形状才能够被选择和拖动。


最后在“放置形状”逻辑中增加一块新的积木。

如图,在执行真正的删除操作前,先将当前的形状标识为删除状态,这样在进行后续的形状检查时,就不需要再对这个形状进行一次检查了。


我们在什么时机进行形状检查呢?每当一个形状被放置到网格上后,就应该对剩余的形状进行一次检查,所以每当游戏中的形状数量发生变化时,也就是我们执行形状检查的时机。


选择“形状管理”,在“形状数量发生变化”的块中,新增如下的逻辑。

每当形状数量发生变化后,就发送一次“检查形状”的通知,通知剩余的形状进行检查。如果游戏中的有效形状数量为0,则证明游戏结束了,发送一个“游戏结束”的通知。


最后,我在场景中增加了一个简单的游戏结束的界面,当接收到“游戏结束”的通知时就会显示。用于表示游戏结束,点击按钮可以重新开始游戏。逻辑非常的简单,在此就不多做赘述了。


预览一下游戏,看看最后的游戏结束效果。

当把中间的形状放置在网格中后,网格中不再有位置可以放置剩余的两个形状了,剩余的形状失效(变暗),游戏结束,显示游戏结束页面。


总结一下


这一节中我们实现了形状检查的功能,并且增加了游戏结束的判定,这样1010游戏的整体流程算是完整了。


练一下


到此为止整个1010游戏玩法的所有功能我们都已经实现了,你的1010做到哪一步了呢?所有的形状都已经完成了吗?


如果你对游戏开发感兴趣,欢迎关注我,如果你有对游戏开发感兴趣的朋友,也欢迎把这个系列文章推荐给他。



相关文章
|
25天前
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
381 7
|
25天前
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
448 1
|
29天前
|
缓存 小程序 索引
uni-app开发微信小程序时vant组件van-tabs的使用陷阱及解决方案
uni-app开发微信小程序时vant组件van-tabs的使用陷阱及解决方案
161 1
|
20天前
|
存储 小程序 安全
微信的开发管理都需要配置什么?
【10月更文挑战第17天】微信的开发管理都需要配置什么?
27 0
|
25天前
|
JavaScript 小程序 开发者
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
257 0
|
29天前
|
小程序
uni-app开发微信小程序使用onPullDownRefresh(下拉刷新)总结
uni-app开发微信小程序使用onPullDownRefresh(下拉刷新)总结
390 0
|
1月前
|
小程序 前端开发 测试技术
微信小程序的开发完整流程是什么?
微信小程序的开发完整流程是什么?
102 7
ly~
|
2月前
|
存储 供应链 小程序
除了微信小程序,PHP 还可以用于开发哪些类型的小程序?
除了微信小程序,PHP 还可用于开发多种类型的小程序,包括支付宝小程序、百度智能小程序、抖音小程序、企业内部小程序及行业特定小程序。在电商、生活服务、资讯、工具、娱乐、营销等领域,PHP 能有效管理商品信息、订单处理、支付接口、内容抓取、复杂计算、游戏数据、活动规则等多种业务。同时,在企业内部,PHP 可提升工作效率,实现审批流程、文件共享、生产计划等功能;在医疗和教育等行业,PHP 能管理患者信息、在线问诊、课程资源、成绩查询等重要数据。
ly~
76 6
|
1月前
|
小程序 前端开发 数据安全/隐私保护
微信小程序全栈开发中的身份认证与授权机制
【10月更文挑战第3天】随着移动互联网的发展,微信小程序凭借便捷的用户体验和强大的社交传播能力,成为企业拓展业务的新渠道。本文探讨了小程序全栈开发中的身份认证与授权机制,包括手机号码验证、微信登录、第三方登录及角色权限控制等方法,并强调了安全性、用户体验和合规性的重要性,帮助开发者更好地理解和应用这一关键技术。
53 5
|
1月前
|
小程序 前端开发 JavaScript
微信小程序全栈开发中的PWA技术应用
【10月更文挑战第3天】微信小程序作为新兴应用形态,凭借便捷体验与社交传播能力,成为企业拓展业务的新渠道。本文探讨了微信小程序全栈开发中的PWA技术应用,包括离线访问、后台运行、桌面图标及原生体验等方面,助力开发者提升小程序性能与用户体验。PWA技术在不同平台的兼容性、性能优化及用户体验是实践中需注意的关键点。
53 5
下一篇
无影云桌面