4. 优化游戏

4.1. 教程介绍

上节课我们制作了小猫抓鱼的游戏,在玩游戏中,可以发现游戏中有很多可以优化的地方。在这节教程中,让我们带着问 题,从提高游戏有趣性出发,去体验游戏,发现问题,解决问题,通过不断的调试猫吃鱼游戏的代码,来制作一个高品质 的小游戏。在这个过程中,我们也会同时介绍新的积木块的使用方法。

当然,对游戏本身的追求没有终点,我们一直在路上。

4.2. 发现问题

在上一节的课程中,我们是通过小猫和鱼的坐标是否一样,来判断小猫有没有抓到鱼。但是在玩游戏的时候,我们会发 现,因为每次按键移动的坐标幅度不是1,所以想要坐标完全一样确实有点困难。有没有一个方法,可以让小猫碰到鱼就 算获胜呢?

4.3. 解决问题

这节课给大家介绍一个新的方法—精灵重叠事件。

📌积木块位置:精灵-重叠-当sprite类型与otherSprite类型Player重叠时

../../../_images/optimize1.webp

💡积木块含义:当一个精灵与另一个精灵重叠时,运行事件内部的积木块,只要两个不同类型的精灵有重叠的部分,那么就会 触发这个事件。

如何来确定想要的两个精灵重叠呢?

在上节教程《猫吃鱼》游戏中,创建了两个精灵,我们已经为猫选择Player(玩家)类型,为鱼选择Food(食物)类型。

在设置类型的时候同学们可能会有疑惑:

为什么要选择精灵类型?这是因为在一些事件中,是通过选择精灵的类型来指代精灵的。比如精灵重叠事件,通过选择精灵类 型来指代精灵。

TIPS:完整的游戏经常会有不同类型的精灵重叠事件,因此在创建精灵的时候,就应该将精灵类型设置好以防止后期精灵太多 造成程序混乱。

在《猫吃鱼》游戏中,猫类型选择为Player(玩家),鱼类型为Food(食物),那么在重叠事件中的类型,猫吃到鱼重叠事 件,应该是Player(玩家)与Food(食物)重叠。

🎮编程操作①:将“当sprite类型Player与otherSprite类型Player重叠时”积木块拖取到代码区任意位置。修改默认的精灵 类型,将otherSprite类型的“Player”下拉选择“Food”。

../../../_images/optimize2.webp

🎮编程操作②:我们把“游戏获胜”积木块放在重叠事件内部。

../../../_images/optimize3.webp

来试一下我们改进之后的游戏吧。

../../../_images/optimize4.gif

这个游戏虽然简单,但是它已经是一个完整的游戏了。有角色,有游戏规则。

4.4. 发现问题

当然一个游戏的趣味性以及挑战性也很重要,这个小猫抓鱼的游戏,我们很容易就可以获得胜利,玩几次可能就没有兴趣 了,怎么来增加游戏的挑战性呢?

4.5. 解决问题

创建敌人精灵-幽灵

作为刚接触游戏编程的同学们,在设计游戏的时候,可以从玩过的游戏中寻找灵感。

游戏产业初创时期的街机游戏往往蕴含着游戏规则的经典模式,说到对街机游戏的初印象,那“吃豆人”游戏一定占有举足轻重的位置,我们可以从吃豆人游戏中寻找灵感。

../../../_images/optimize5.gif

吃豆人游戏

日本时间1980年5月22日,游戏公司南梦宫(Namco)推出了一款有史以来最为成功的街机游戏——吃豆人。它在同年10月经由Midway 公司引入美国后,迅速成为一款能够被各种人群喜爱的全民游戏。

在今天看来,吃豆人除了吃,就是被追着满屏幕乱跑,似乎算不上什么魅力主角。但在上世纪八十年代,他绝对是个开创性的存在。

吃豆人游戏中,玩家每关都会被四个颜色不一的幽灵追赶,而这红粉青橘四种颜色的四个幽灵其实都有不同的“个性”。在游戏开发者岩谷徹的设计中,红色幽灵性格火爆,总是会紧紧栓着玩家跑;粉色幽灵老谋深算,会埋伏在玩家可能经过的路线上;青色幽灵自由散漫,时而追着玩家跑,时而视而不见;橘色幽灵傻乎乎,总是瞎晃荡。

../../../_images/optimize6.gif

拆解下吃豆人游戏模式:

吃豆人在吃豆子的时候,有一个幽灵会去追踪它,吃豆人要在吃豆子的同时躲避幽灵,如果被幽灵追上的话,游戏就失败了。

以吃豆人中的幽灵为灵感,这里我们也在游戏中增加一个幽灵的角色,并且这个幽灵会追踪小猫。

🎮编程操作①:将“创建精灵”积木块拖取到“当开机时”事件内部,为幽灵选择一个精灵形象,设置精灵类型为“Enemy”。

../../../_images/optimize7.png

🎮编程操作②:设置精灵的初始位置X:141,Y:104 。

../../../_images/optimize8.webp ../../../_images/optimize9.webp

怎么样可以让幽灵追踪小猫呢?

精灵工具箱中有一个精灵跟随积木块。

📌积木块位置:精灵-物理-设置myEnemy跟随mySprite

../../../_images/optimize10.webp

🎮编程操作③:拖取精灵工具箱中“设置myEnemy跟随mySprite”积木块到“创建幽灵”积木块下方。myEnemy下拉选择“幽灵”,mySprite下拉选择“猫咪”。

../../../_images/optimize11.webp

我们看看模拟器上的显示效果。

../../../_images/optimize12.gif

我们会发现幽灵咻的一下就跑到了猫咪的身边,这么快的速度,这游戏没玩就挂了。。。

这显然在游戏中是不合理的,怎么去改变幽灵跟随的速度呢?

我们点击看看幽灵的初始默认值是多少?

🎮编程操作④:点开后面的+号,默认的速度是100,我们可以修改这个速度值,一边修改一边在模拟器上看效果,直到达到你想要的跟随速度。速度越大,游戏获胜越难。

这种一边实践一边发现问题的过程,我们称为调试。每一个优秀的作品,都是经过了很多次的调试和完善的哦!

加上幽灵之后,我们来完善一下游戏规则:

当猫咪抓到鱼,游戏胜利;当幽灵追上猫咪,游戏失败。

🎮编程操作⑤:幽灵追上猫咪,同样的也是使用重叠事件,同学们可以自己编写一下这个程序。

4.6. 发现问题

到这里,我们为猫吃鱼游戏增加了一个敌人幽灵,使得游戏更加有挑战性,但是当猫吃到鱼或者幽灵追上猫,这个游戏就结束了,我们还可以继续增加游戏规则。

4.7. 解决问题

增加游戏规则

在吃豆人的游戏中,在吃到豆子的时候,游戏得分会+1;吃豆人被幽灵追上,生命值会-1,吃豆人回到初始位置;当生命值等于0,游戏结束。

参考这个规则,我们把猫吃鱼游戏进阶版的规则修改如下:

1) 游戏对象(三个类型精灵):小猫(玩家类型) 小鱼(食物类型) 幽灵(敌人类型);

2)初始生命值和分数:小猫初始生命值为3, 游戏初始得分为0;

3)游戏规则: 小猫吃到鱼,得分+1,小鱼从其他位置再次出现;幽灵追到猫,生命值-1,小猫回到初始位置,生命值为0,游戏结束;

4)游戏目标: 小猫需要在游戏结束前尽可能抓到更多的小鱼。

游戏的基本框架已经完成了,接下来我们根据增加的游戏规则来继续完善游戏。

为玩家设置生命值。

📌积木块位置:游戏信息-生命值-设置生命值为3

../../../_images/optimize13.webp

💡积木块含义:

为玩家设定一个初始的生命值,积木块默认生命值为3。

🎮编程操作①:将“设置生命值为3”积木块拖取到“当开机时”事件内部的最下方。

../../../_images/optimize14.webp ../../../_images/optimize15.webp

设置初始分值为0。

📌积木块位置:游戏信息-得分-设置得分为0

../../../_images/optimize16.webp

🎮编程操作②:拖取“设置得分为0”积木块到当开机时内部最下方。

../../../_images/optimize17.webp

当猫吃到鱼时,得分加1。

🎮编程操作③:拖取“得分增加1”积木块到玩家和食物重叠事件中。

../../../_images/optimize18.webp

TIPS:幽灵追到猫的时候,生命值-1。当生命值=0的时候,游戏会自动结束,所以我们不需要对生命值=0再做判断。

🎮编程操作④:拖取“生命值增加-1”积木块到幽灵和猫咪重叠事件内部。

../../../_images/optimize19.webp

在模拟器试玩一下:

../../../_images/optimize20.gif

通过模拟游戏可以发现:

小猫吃到鱼的时候,鱼没有消失,得分一下子增加很多,并不是+1;幽灵追上猫的时候,游戏一下子结束了,并不是生命值-1。

程序出现了Bug,我们来找一下,看看到底是哪里出现问题了呢?

出现这个Bug的原因是我们的精灵重叠积木块,只要精灵重叠在一起,就会不停的触发,然后执行内部的程序。

在游戏中,猫咪吃到鱼的时候,一直和鱼重叠在一起,并没有分开,所以我们的得分增加1这个积木块也一直被调用。幽灵追上猫也是同样的问题。

怎么解决这个问题呢?

我们可以在两个精灵重叠事件里,在运行增加得分或减少生命值之后,把两个精灵分开。

在猫和鱼重叠时,将鱼精灵的位置重新放置到屏幕的其他位置。

🎮编程操作⑤:拖取“设置猫咪位置”积木块到猫和鱼重叠事件内部,为鱼重新设置一个位置:X:80,Y:80,这样在屏幕上的效果就是鱼被猫吃了,在屏幕上又出现了另外一条鱼。

../../../_images/optimize21.webp

我们在模拟器上试玩一下看看游戏效果怎么样:

../../../_images/optimize22.gif

游戏又出现了一些问题:小猫第一次吃到鱼的时候,鱼到了80,80的位置,第二次小猫吃到鱼的时候,鱼还是在80,80这个位置。这样在屏幕上的效果就是第二次吃到鱼之后,鱼并没有消失,分数还是在一直增加。

想要的游戏效果是猫咪每次吃到鱼之后,屏幕中随机位置再次出现鱼,那有没有积木块可以设置让鱼从屏幕中随机出现呢?

工具箱中有可以为鱼的位置设置一个随机数的积木块。

屏幕的范围是X:0-160, Y:0-120,我们在选取坐标的时候也发现了,我们的X Y的值都是整数,也就是说我们的范围是X为0-160里面的任意一个整数,Y是0-120里面的任意一个整数。

📌积木块位置:数学-选取随机数,范围0至10

../../../_images/optimize23.webp

🎮编程操作⑥:拖取“选取随机数,范围为0至10”积木块到XY数值框中,X轴范围选择0-160,Y轴范围选择0-120。

../../../_images/optimize24.webp

我们来体验一下游戏效果看看:

../../../_images/optimize25.gif

可以看到,每次猫咪吃到鱼,得分加1,鱼从屏幕随机出现。

同样的,我们来处理一下幽灵追上猫的重叠事件。

这里小猫被追上之后,位置变为初始值(80,60):

../../../_images/optimize26.webp

在我们的不断调试,以及修改之后,小猫吃鱼这个游戏和之前的比起来,内容更加的丰富了,游戏规则也更完善。

../../../_images/optimize27.png

不过,在小猫吃到鱼之后,设置精灵位置积木块这里还有一个小小的bug。当然,这个bug并不影响我们目前的游戏,但是如果我们的游戏更加复杂,可能就会有所影响。这个bug你能找到吗?

下次讲到变量的时候,我们一起来找bug吧!

4.8. 课后作业

发挥想象力,改变里面的规则,做一个自己的小猫吃鱼,期待你们的表现!