Scratch全国少儿编程竞赛获奖作品《穿越时空的大战》解析下篇

网友投稿 2019-11-19 14:11

Scratch全国少儿编程竞赛

获奖作品解析
《穿越时空的大战》

本文介绍的作品是全国青少年创意编程与智能设计大赛创意编程比赛一等奖获得者齐嘉懿同学的参赛作品。

作品说明

游戏主人公在名侦探柯南的帮助下,体验了最新的科技发明——AI机器人和时光机。乘坐时光机回到过去之后,在AI监测系统的帮助下,还原出了事实的真相,并成功带领自家花园里的植物利用高科技装备战胜僵尸,保卫家园的故事。
游戏中运用到了变量、循环嵌套、克隆体、列表、字符串连接等功能,并用到了多种算法,包括遍历算法、排序算法、求和、求平均值和最值等算法。
另外,游戏中还有很多原创的角色,如太阳花,AI防御网等。

正文https://cdn.china-scratch.com/timg/191121/1411364105-0.jpg

在上一篇文章中,我们完成了名侦探柯南发出的能量收集的任务,开启了时光机,接下来我们就要穿越时空回到过去,参与一场僵尸反入侵的战斗,保卫妈妈的卧室。大战即将开始,你准备好了吗,快点乘上时光机吧!

https://cdn.china-scratch.com/timg/191121/1411364H3-1.jpg

点击“乘坐时光机”按钮之后,游戏立即切换到时光机的场景,我们的游戏主角乘坐时光机正在穿越时空。咦,这段台词怎么这么熟悉?

https://cdn.china-scratch.com/timg/191121/14113J243-2.jpg

时光机着陆之后,入侵者立刻来袭。唉?这不就是植物大战僵尸吗!哈哈,相信同学们一定都玩过这个游戏,这里原来就是简化版的植物大战僵尸呀。大家都会玩这个游戏,但是可不一定知道如何用Scratch来制作出这个游戏。那接下来,果冻老师就和大家一起看看这个游戏是如何实现的吧。

当背景换成草坪

植物大战僵尸的游戏背景是一片草坪,所以僵尸呀、土豆呀、太阳呀都会响应背景换成草坪这个事件。

https://cdn.china-scratch.com/timg/191121/14113J5U-3.jpg

不用老师介绍,大家肯定知道这些都是植物大战僵尸游戏中的角色。首先我们来看游戏中最重要的角色:僵尸。它们一个接一个的从屏幕右侧出现并向左移动,最终的目的就是进入并搞乱妈妈的房间。

https://cdn.china-scratch.com/timg/191121/14113M1X-4.jpg

游戏开始后,每隔3秒克隆一个普通僵尸,一共克隆出10个。

僵尸一波一波的很可怕,我们必须抓紧时间消灭它们,在僵尸行走的过程中,我们有两种方法可以消灭它们,第一种方法就是使用坚果:

https://cdn.china-scratch.com/timg/191121/14113H646-5.jpg

代码中设置了移到x:238,所以僵尸会固定的出现在屏幕的右侧,但是y坐标设置为-121和107之间的随机数,所以僵尸在纵向上是随机出现的,它会朝屏幕左侧一直行走,每一次行走的步数也是在5步到10步之间随机的,所以僵尸的速度有快有慢,行走的过程中如果被坚果砸到,那么僵尸数量这个变量的值就会减1,代表这个僵尸被消灭掉了。

如果僵尸走到屏幕最左边了还没有碰到坚果,那么清除车就会出动推走僵尸,这是消灭僵尸的另一种方法,但是每一行只有一个清除车,出动一次就会少一个。

https://cdn.china-scratch.com/timg/191121/14113R550-6.jpg

我们知道了使用坚果可以消灭僵尸,那坚果是如何产生的呢?这就涉及到了其中的这几个角色:

https://cdn.china-scratch.com/timg/191121/14113R0Y-7.jpg

太阳花每隔一段时间会产生小太阳,收集小太阳到阳光银行(SunBank)中,通过阳光银行可以购买坚果卡片,点击坚果卡片就会变成坚果。这是正常产生坚果的逻辑,但是由于我们参加的并不是游戏制作比赛,所以简化版的游戏中收集太阳花和购买坚果卡片都是电脑自动运行的。

那需要我们写代码实现的就是产生小太阳和卡片变坚果的这两个过程了。

首先来看产生小太阳的代码。

https://cdn.china-scratch.com/timg/191121/14113V363-8.jpg

游戏开始后,每隔1至2秒就会产生一朵小太阳,并且这朵小太阳从太阳花的位置向上飞到阳光银行的位置。

https://cdn.china-scratch.com/timg/191121/14113RC8-9.jpg

小太阳通过滑行语句飞向阳光银行,然后增加了sun变量的值,最后消失。

卡片变坚果的代码就稍稍有点复杂了,代码中需要完成鼠标点击的判断以及土豆滚动撞击消灭僵尸的效果。

游戏开始后,每间隔3秒钟会自动克隆出一张坚果卡片:

https://cdn.china-scratch.com/timg/191121/14113a0Z-10.jpg

坚果卡片会沿着顶部的卡片框一直向右滑动,直到移动到右边框或者碰到其它的卡片才停止下来。

https://cdn.china-scratch.com/timg/191121/1411392N0-11.jpg

在重复执行的语句里面有一条等待的语句,这条等待语句的条件是角色X坐标>60(移动到方框的最右边)或者碰到灰色(碰到其它卡片)不成立,也就是说如果条件不成立,就会一直运行重复执行语句,卡片会一直向右移动。而当等待语句的条件成立时,代码就会运行到等待语句这里停止不再执行重复语句,也就是说卡片会停下不再移动了。

如果我们继续用鼠标点击坚果卡片的话,就会触发克隆坚果的命令:

https://cdn.china-scratch.com/timg/191121/1411394150-12.jpg

克隆的代码很简单,仅仅将坚果显示出来。

https://cdn.china-scratch.com/timg/191121/1411392A4-13.jpg

而真正的处理逻辑代码是写在wall-nut这个广播中的。

https://cdn.china-scratch.com/timg/191121/14114043H-14.jpg

wall-nut广播是点击坚果卡片后发出的,鼠标松开后,首先坚果初始化显示第一个造型,并且在点击鼠标前一直跟随着鼠标的位置移动。在重复执行语句中拖入移到鼠标指针语句就可以实现角色跟随鼠标的效果。

当我们再次点击鼠标后,坚果通过移到XY语句在鼠标指针的位置处放下,但是这里没有完全按照鼠标指针的位置放置,坚果的X坐标通过了一个四舍五入和乘除的运算语句稍稍前移了一下,这样坚果的初始位置会更加的合理。

接下来,在代码中嵌套了两个如果那么语句,第一个如果那么语句判断坚果的位置不能放在舞台的边缘,第二个如果那么语句判断坚果的位置必须是在红线的左边,如果这两个条件不满足的话,就不会执行它们里面的语句。

它们里面放置了一个重复执行语句,这个重复执行语句的作用就是让坚果不停的向右滚动,直到舞台右侧。向右移动通过移动5步语句实现,滚动的效果通过不断切换下一个造型实现,要注意的是,如果坚果变到了最后一个造型的话,我们需要手动再将它切换到第一个造型,这样坚果的滚动效果才会是循环不停的。在舞台的最右侧有一个黄色的竖线角色,重复执行语句的条件就是判断坚果是否碰到了这条黄色竖线,如果碰到了就结束重复执行语句,继续执行后面的隐藏语句,将坚果隐藏掉。

坚果滚动过程中碰到僵尸的代码逻辑我们在僵尸角色中已经介绍过了。

好了,以上就是产生太阳、收集坚果卡片、使用坚果消灭僵尸的整个过程,经过老师的介绍,游戏的过程是不是就很清晰了?相信同学们对代码都已经搞明白了,如果还有不懂的地方可以再返回去多看看几遍。

https://cdn.china-scratch.com/timg/191121/141140LP-15.gif

游戏中一共会出现20个僵尸,当我们把这些僵尸都消灭完后,游戏的难度会提升,接着出现好多的僵尸坦克,这些坦克的速度可比僵尸快多了,坚果对于坦克来说无疑是鸡蛋碰石头,毫无作用,所以我们推出威力巨大的椰子大炮,发射椰子炮弹来消灭坦克。

坦克来啦

https://cdn.china-scratch.com/timg/191121/1411412D1-16.jpg

以上就是坦克大战所涉及到的角色,其中僵尸坦克角色与上面僵尸的代码非常类似,而椰子炮-炮架子角色的代码则非常简单,就不在这讲解它们了。而剩下的两个角色炮筒和炮弹老师则要说一说。

在坚果卡片的代码中,我们知道要让一个角色随着鼠标移动可以在重复执行语句中加入一个移到鼠标指针的语句。如果角色不是随着鼠标移动而是要它固定在某个位置只是面向鼠标指针的位置转动该怎么做呢?有同学想到了,就是把移到鼠标指针语句换成面向鼠标指针语句:

https://cdn.china-scratch.com/timg/191121/1411413238-17.jpg

这样,炮筒就会固定在舞台区的左侧,并且随着鼠标指针的位置转动,随时准备着朝向鼠标的位置发射炮弹。

https://cdn.china-scratch.com/timg/191121/1411413K6-18.gif

哇,坦克来的好快啊!我们必须赶紧消灭它们!

https://cdn.china-scratch.com/timg/191121/141142LY-19.jpg

点击鼠标之后,代码会克隆出一颗炮弹,然后这颗炮弹会从炮筒的位置向鼠标指针的位置发射出去,如果炮弹在运行的过程中碰到了坦克就会将坦克消灭掉,最后它触碰到舞台的边缘后被删除,这颗炮弹的使命就完成了。

https://cdn.china-scratch.com/timg/191121/1411423056-20.jpg

二十几辆僵尸坦克来势汹汹,看似威猛,但是在我们的一顿操作之下也都被消灭掉了。

巨人僵尸出现

可是,游戏并没有结束,屏幕右侧又走出来一个巨人僵尸,什么!居然还有终极Boss,这是要挑战我们的手速吗?可是,无论我们点击鼠标、键盘如何操作都没有反应,只能眼睁睁的看着这个巨人僵尸走过来一颗一颗的吞噬掉我们的坚果。

https://cdn.china-scratch.com/timg/191121/1411424236-21.jpg

巨人僵尸一步步的向房间靠近,遇到坚果(每个坚果的右侧都有一个蓝色的小点)就将它吃掉,我们只能在一旁看着悲剧发生,束手无策,这可怎么办呀?

突然,游戏主角想到,在他乘坐时光机的时候,名侦探柯南同时为他带来了一件巨型的防御武器,名字好像叫做AI防御网,面对这个无法控制的巨人僵尸,是时候请出这个终极武器了!

https://cdn.china-scratch.com/timg/191121/1411434553-22.jpg

这个防御网呢,实际上是一个五边形多层网状结构图案,是通过Scratch软件的画笔扩展模块绘制出来的,图案的样子是这样:

https://cdn.china-scratch.com/timg/191121/1411432A0-23.jpg

它由五个五边形组成了一个花瓣的图案,然后由内向外一层一层堆叠起来。那如何使用代码来画出这样的图案呢,下面我们就一步一步来实现它。

第一步,定义好边数、层数、角度这三个变量的值。

https://cdn.china-scratch.com/timg/191121/1411433T7-24.jpg

边数设置我们要画的图案是几边形,每一层几个图案,很明显我们的图案是五边形,每一层都有五个。

层数设置图案一共重复绘制几次,这里重复6次,也就是说有6层。

角度设置画笔在画第一笔时所面向的方向。

在绘制的过程中还涉及到一个变量,叫做边长,它设置五边形每个边的长度,并且每绘制一层这个边长的值就会增大,这样五边形一层就比一层的大。

第二步,使用画笔画出一个五边形。

https://cdn.china-scratch.com/timg/191121/1411436358-25.jpg

代码中,有一个重复执行语句,它里面的移动边长步语句可以画出一条线,画完后画笔向左旋转360÷5=72度,这样重复执行5次,就完成了一个五边形的绘制。

https://cdn.china-scratch.com/timg/191121/141143EY-26.jpg

第三步,在这个重复执行的外面再套一层重复执行,每画完一个五边形画笔同样左转72度。

https://cdn.china-scratch.com/timg/191121/1411442123-27.jpg

这样,五个五边形就组成了一个类似花瓣的图案。

https://cdn.china-scratch.com/timg/191121/14114450W-28.jpg

第四步,在两层重复执行的外面再嵌套一层重复执行,这次重复的次数是变量层数的值,也就是说我们要画出6层的花瓣图案。

https://cdn.china-scratch.com/timg/191121/1411445302-29.jpg

每一层五边形的颜色与边长一样也是变化的,这样,强大的AI防御网最终就绘制完成了,代码最后广播巨人僵尸死去,可怕的终极Boss终于被我们收拾掉了,激烈的反入侵战斗也停止了,我们完成了名侦探柯南赋予的任务,成功的保卫住了妈妈的房间!

https://cdn.china-scratch.com/timg/191121/1411444947-30.gif

总结

在这篇文章中,我们学习了《穿越时空的大战》这部作品的后半部分,这部分内容虽然不像上半部分内容那样有各种各样让人惊讶的编程技术和效果,但是它为我们展示了一个完整的植物大战僵尸游戏的开发过程,这个过程中使用了很多的判断语句,很多的重复执行语句,还有各种的广播、变量这些角色连接的方式,通过这个过程充分展现了参赛者的逻辑思维能力。何时僵尸应该上场,何时坦克应该出现,如何使用坚果消灭僵尸,如何绘制防御网的图案,同学们不要小看这些内容,如果说上篇文章是编程特技的展示,那这篇文章才是编程基本功的体现,这些基本功看似平淡无奇,却不是一天两天能练成的,千里之行始于足下,没有扎实的基本功就无法走的更远,要想获得全国比赛的一等奖,努力学好这篇文章的内容才是最应该的,加油吧,同学们!

--end--

声明:本文章由网友投稿作为教育分享用途,如有侵权原作者可通过邮件及时和我们联系删除:freemanzk@qq.com