Flappy Bird

这篇文章会介绍，如何在 Scratch 里使用连续背景、变数、定位、座标、重复、侦测碰到其他角色...等积木，实作 Flappy Bird 小游戏。

相关文章参考：定位、重复、侦测碰到其他角色。

角色设定

在角色编辑区，删除猫咪角色，加入飞行猫咪“cat”角色。

下载范例图片 ( 连续背景 )，使用“上传”方式建立背景“bg”角色，建立角色后，切换到“造型”页签，点击“转换成向量图”，将原本位图的图片转换成向量图对象，转换成向量图后，就可以很方便地改变位置和尺寸。

转换向量图后，使用选取工具放大图片 ( 可以先将图片移动到右下角，然后拖拉角落节点变更尺寸 )。

将图片“对齐画布中心”，放大后的高度必须“大于 360”( 因为舞台高度为 360 )。

复制同一张图片并再度贴上，使用鼠标和件盘调整位置，将两张图片的边缘贴合，变成一张超长的图片，贴合的位置也是之后要重复背景的位置。

将组合后的超长背景的中心点对齐画布中心 ( 可以先将两张图片组成群组 )，记录组合后的实际长度 ( 范例图片为 1354 )

下载范例图片 ( 水管 )，使用“上传”方式建立水管“pipe”角色。

完成后，舞台上应该就能看到三个不同的角色。

积木程序原理 ( 猫咪 )

Flappy Bird 的游戏方式，是在按下键盘空白键时，让角色不断在舞台中跳耀，参考下表，可以使用简单的公式模拟重力加速度，图表的红色曲线是猫咪的“位置”，蓝色直线是每次重复时“y 座标要改变的数值”，因为每次要改变的数字会变多，所以下坠的幅度会越来越快，当按下空白键跳耀时，就将改变数值变成 10，就能产生跳耀的效果。

将猫咪移到最上层并定位到舞台正中间，接着新增一个名为 y 的变数，使用“重复无限次”、“如果...那么...否则”积木，判断是否按下空白键，如果按下空白键，就设定 y 为 10，如果没有按下空白键，就让 y 模拟重力加速度不断改变 -2，最后透过角色 y 的改变，就能够做到按下空白时，猫咪不断往上跳，没有按空白，猫咪往下自由落体的效果。

完成后，点击绿旗，不断按压空白键，就可以看到猫咪在画面中上下跳动。

加入判断“鼠标键被按下”的逻辑，就能在手机或移动设备里，透过点按控制猫咪跳耀。

接着为猫咪角色新增第二组绿旗点击程序，使用“重复无限次”搭配变数，实作每隔 0.1 秒就增加 0.1 分的计分逻辑，新增第三组绿旗点击程序，等待碰到水管 pipe 角色后，就停止所有重复程序。

积木程序原理 ( 背景 )

将背景“bg”角色，对齐舞台左侧，参考下图的公式，就能计算齐左侧后的座标，范例的角色宽度为 1354，计算座标为 1354/2 - 480/2 = 437 。

左侧 x 座标 = 角色宽/2 - 舞台宽/2

当背景移动到 -240 时，就会是刚好背景连接的位置，也是要切换回原本 437 的时机点。

根据这个原理撰写程序，让背景不断往左移动，抵达 -240 时，切换为 437。

完成后，点击绿旗，背景就会不断往左移动，看起来就像猫咪不断往前飞。

积木程序原理 ( 水管 )

因为画面中会不断出现水管，所以水管角色采用“分身”的方式进行，一开始先隐藏本尊，然后每隔一秒建立分身，就能够让水管每隔一秒不断出现。

分身建立后，显示分身，新增一个“位置”变数，随机设定为 1 或 2，如果是 1，将分身定位在右边上方，如果是 2，将分身定位在右边下方 ( 高度使用 200～240 的随机数，让出现的高度不相同 )，接着使用“重复无限次”、“如果...那么...否则”积木，让水管不断往左移动，当移动到最左边时，就删除分身。

完成效果

所有角色的程序都完成后，点击绿旗，就能够开始进行猫咪的 Flappy Bird 的游戏。

范例解答

范例解答：Flappy Bird

延伸练习

如果已经熟悉了Flappy Bird的原理，还可以尝试更多好玩的作法：

• 加上“计算碰撞次数”的机制。( 解答 )
• 加上“计时”的机制。( 解答 )

意见反馈