4

微信小游戏开发实战7:图形的数据验证

 2 years ago
source link: https://blog.51cto.com/u_15530520/5239016
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

微信小游戏开发实战7:图形的数据验证

原创

小蚂蚁教你做游戏 2022-04-21 16:32:58 博主文章分类:微信小游戏开发 ©著作权

文章标签 游戏开发教程 小游戏开发 学习做游戏 文章分类 手游开发 游戏开发 阅读数175

 ​上一篇​​文章内容很多,也挺难的,不光我自己写的很累,估计读者读的也很累,这并不是我想要的结果。每一篇教程我都希望它能够帮助读者学到一点儿新的东西,并在小游戏开发的道路上向前行进一步。如果一篇技术型的文章过长,就很容易把读者吓退,从而会失去它本来应该传递的信息和价值。所以从这篇教程开始,我决定每一篇都聚焦于一个小功能,一个知识点,并尽力把它讲透,讲明白。希望它能帮助你进行点滴的积累,构建起自己的小游戏。

言归正传,上一节中我们实现了将拖拽的图形放置到网格中,在真实的游戏中网格并不会总是空的,如果网格上的位置已经被填充了,那么图形是不能重叠放置的。这一节,我们就来实现一下图形的数据验证,判断拖拽的图形到底能不能放置在当前的位置上。

先来看一张图。

微信小游戏开发实战7:图形的数据验证_游戏开发教程

图中有1~6编号的6个图形,超出网格边界或者重叠的位置都不能放置,所以编号1~5的图形都不能被放置,只有图形6可以被放置。

实现思路一目了然了,判断一个图形能不能被放置,需要同时满足两个条件:

  • 图形位于网格之内,不能超出网格的任一边界。
  • 网格的当前位置没有被填充。

下面,我们就动手实现一下这样的效果:拖拽图形到网格上,如果当前的位置可以放置,则进行放置,如果当前的位置不能放置,则将图形放回到原位置。

选择“容器-1”为其增加一个“可放置”的局部变量,用于保存验证结果。增加“原位置X”和“原位置Y”的局部变量用于设置图形的原始位置。

微信小游戏开发实战7:图形的数据验证_游戏开发教程_02

新增一个“放置形状”的通知,如果验证通过的话,我们会发送这个通知,告诉图形可以进行填充了。

微信小游戏开发实战7:图形的数据验证_游戏开发教程_03

接着,我们看一下“容器-1”上的积木逻辑。

微信小游戏开发实战7:图形的数据验证_游戏开发教程_04

如图,逻辑中做了两个判断:边界判断和当前位置是否被填充的判断。其中“是否被填充的判断”需要使用当前图形的“形状数据”与“全局-网格”数据做比对(如果你忘记了全局网格数据,请回顾​ ​全局网格数据​​一节),满足放置条件的话,就发送“放置形状”的通知,否则的话就将图形放回原始位置。

放置形状的逻辑如下,​ ​上一节​​中已经详细讲过,在此不再赘述。

微信小游戏开发实战7:图形的数据验证_小游戏开发_05

最后,选择“填充方块”为其增加一块逻辑积木,当在网格上填充该方块时,将网格上当前位置的数据设置为“1”。

微信小游戏开发实战7:图形的数据验证_游戏开发教程_06

预览一下场景,看一下最终的效果。

微信小游戏开发实战7:图形的数据验证_游戏开发教程_07

超过边界或者已经填充的位置都无法进行放置,图形都会返回原位置,只有网格内未填充的位置才能放置形状。

总结一下:

这一节我们学习了如何对拖拽的图形进行验证。想要将图形放置在网格上需要满足两个条件:图形位于网格区域内,网格内当前的位置没有被填充。

练一下:

其它图形的验证也都是相同的原理,试着实现一下“L”形图形的数据验证。


我是会做游戏也会教你做游戏的小蚂蚁,想学习做游戏的话,关注我就对啦!欢迎关注公众号【小蚂蚁教你做游戏】,领取全网最全的微信小游戏开发原创教程资料。

微信小游戏开发实战7:图形的数据验证_小游戏开发_08

  • 1
  • 收藏
  • 评论
  • 分享
  • 举报

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK