Day27 ( 游戏设计 ) 老鼠走迷宫

老鼠走迷宫

教学原文参考:老鼠走迷宫

这篇文章会介绍如何使用「创建角色」、「角色是否碰到其他角色」、「阵列」、「变数」、「逻辑判断」、「计次回圈」、「当按钮按下」等积木,实作一个老鼠走迷宫的 LED 灯小游戏。

相关文章参考:创建角色角色是否碰到其他角色当按钮按下阵列变数逻辑判断

游戏方式

老鼠走迷宫是一个简单的小游戏,游戏开始後,下方会有一个「老鼠」的 LED 灯亮起,上方会有「墙壁」不断往下移动 ( 就像老鼠不断往上爬 ),使用者需要操纵「老鼠」左右移动闪躲墙壁,如果老鼠撞到墙壁就输了。使用 micro:bit 的游戏操作步骤如下:

  • AB 按钮同时按下,开始游戏。
  • 游戏开始後,下方出现「老鼠」角色 LED,上方出现「墙壁」往下移动 ( 亮度较暗 )。
  • 按下 A 按钮,老鼠角色往左移动。
  • 按下 B 按钮,老鼠角色往右移动。
  • 老鼠从道路穿过墙壁就得分。
  • 墙壁撞到老鼠,游戏结束,显示最後得分。

micro:bit - 老鼠走迷宫

积木程序原理

首先设定启动时的变数:

  • 变数 mouse 为老鼠角色,座标设定为 (2,4)。
  • 变数 list 为一个「二维阵列」,表示不断降下的「墙壁」
    • 二维阵列里每个阵列,用数字表示表示哪三颗灯要亮起。
    • 例如 (1,2,3) 表示亮起第二颗、第三颗和第四颗灯
  • 变数 run 作为游戏开始的判断,预设 0。

micro:bit - 老鼠走迷宫

设定 A、B 按钮控制老鼠移动的程序,按下 A 按钮时角色 x 改变 -1 ( 老鼠往左移 ),按下 B 按钮时角色 x 改变 1 ( 老鼠往右移 )。

micro:bit - 老鼠走迷宫

设定 AB 按钮同时按下,游戏开始的程序:

  • 设定分数的变数 score,预设 0。
  • 将变数 run 改为 1,表示开始游戏。
  • 新增变数 run2,预设 0,如果後续程序里变成 1,就会出现第二层墙壁
  • 新增变数 run3,预设 0,如果後续程序里变成 1,就会出现第三层墙壁
  • 新增变数 time,预设 1000,表示墙壁往下移动的速度 ( 单位毫秒 )。

micro:bit - 老鼠走迷宫

接着设计「第一层」墙壁往下移动的程序:

  • 新增一个「重复无限次」积木。
  • 放入逻辑判断积木,判断如果 run 等於 1 就执行程序
  • 新增 wall 变数,从 list 阵列中取出随机项目,作为点亮墙壁灯号的位置。
  • 新增三个变数 w0、w1、w2,分别代表三个墙壁灯号角色,依据 wall 变数内容设定座标
  • 建立角色後,将亮度调整为 50 ( 比老鼠的亮度暗 )
  • 放入「计次回圈」:
    • 将墙壁角色的 y 设为 index,每次回圈执行时会往下移动。
    • 每次回圈执行暂停 time 毫秒。
    • 如果 index 等於 2 ( 移动到第三次时 ),将 run2 设定为 1,让第二层墙壁出现
  • 计次回圈结束後,删除三个墙壁角色 ( 表示没有撞到老鼠 )。
  • 得分 score 增加 1。
  • 暂停 time 毫秒後再次重复。

micro:bit - 老鼠走迷宫

接着设计「第二层」墙壁往下移动的程序:

  • 复制第一层的重复无限次积木 ( 不需要从新开始,复制刚刚的积木再去进行修改 )。
  • 将逻辑判断的 run1 改成 run2
  • 再重复一开始时,将变数 run2 改为 0 ( 避免重复执行 )。
  • 将下方所有 w0、w1、w2 变数改成 w3、w4、w5
  • 将计次回圈里的变数 run2 改成 run3,让第三层墙壁出现

micro:bit - 老鼠走迷宫

接着设计「第三层」墙壁往下移动的程序:

  • 复制第二层的重复无限次积木 ( 不需要从新开始,复制刚刚的积木再去进行修改 )。
  • 将逻辑判断的 run2 改成 run3
  • 将下方所有 w3、w4、w5 变数改成 w6、w7、w8
  • 计次回圈结束後,让 time 减少 20 ( 让墙壁移动的速度变快 )。

micro:bit - 老鼠走迷宫

在来设计「老鼠碰到墙壁」的程序:

  • 新增一个重复无限次积木。
  • 放入逻辑判断积木,判断如果 run 等於 1,就开始进行碰撞侦测。
  • 再放入三组逻辑判断积木:
    • 如果第一层墙壁存在 ( w0 存在 ),老鼠如果碰到 w0 或 w1 或 w2 就暂停游戏
    • 如果第二层墙壁存在 ( w3 存在 ),老鼠如果碰到 w3 或 w4 或 w5 就暂停游戏
    • 如果第三层墙壁存在 ( w6 存在 ),老鼠如果碰到 w6 或 w7 或 w8 就暂停游戏
  • 在判断 run 等於 1 的逻辑积木之後,新增另外一个逻辑积木
    • 判断「如果游戏暂停」( 表示游戏结束 )。
    • 将变数 run 设为 0 ( 表示游戏准备重新开始 )。
    • 显示最後得分。

micro:bit - 老鼠走迷宫

最後,在按下 A+B 按钮的积木里,加入逻辑判断程序:

  • 判断如果 w0 存在 ( 第一层三个灯还存在 ),就删除第一层三个灯。
  • 判断如果 w3 存在 ( 第二层三个灯还存在 ),就删除第二层三个灯。
  • 判断如果 w6 存在 ( 第三层三个灯还存在 ),就删除第三层三个灯。
  • 清空画面 ( 将显示分数清除 )。
  • 继续游戏。

micro:bit - 老鼠走迷宫

完成後,启动 micro:Bit,按下 AB 按钮,就可以开始进行老鼠走迷宫的游戏。

micro:bit - 老鼠走迷宫

范例修正

在游戏的过程中,发现游戏停止後,分数在某些情形下还会继续累加,原因在於「计次回圈」并没有因为游戏暂停而停止回圈,这时只要透过简单的逻辑判断修正,判断如果游戏正在进行,才进行分数的累计

micro:bit - 老鼠走迷宫

范例解答

范例解答:老鼠走迷宫

实作「老鼠走迷宫」的小技巧

  • 为什麽要使用这麽多个「角色」呢?

    其实更好的做法是使用「阵列」判断,但因为是透过「积木」来操作,使用阵列会造成积木排列的较为复杂,所以透过 MakeCode 内建的游戏积木,建立角色,判断角色碰撞,对於入门者来说较容易理解。

  • 为什麽要「判断角色是否存在」呢?

    因为如果在「角色不存在」的状况下「删除角色」,会造成程序发生错误,所以在删除角色之前,必须先判断角色是否存在,如果角色存在,才能删除角色。

  • 为什麽要使用「游戏继续」和「游戏暂停」呢?

    因为 MakeCode 游戏积木里的「游戏结束」功能,会让整块 micro:bit 功能停止运作,必须重新启动才能继续游戏,且创立角色後,角色会影响 LED 所有的显示画面,使用了游戏暂停就能避免这种情况发生。

关於我

大家好,我是 OXXO,是个即将迈入中年的斜杠青年,如果对我有点兴趣(笑,可以与我联系,一起来做点有玩又有创意的东西吧!


<<:  如何在 WordPress 设定 Google reCAPTCHA 保护(登入、留言、联络)表单,免遭恶意攻击

>>:  Day 22:专案05 - KKBOX风云榜01 | AJAX

Day2 NiFi 架构与 Component 简介

在前面,我有稍微带到 Apache NiFi 的性质与特点,但除了了解这些之外,我们也要清楚知道这个...

TailwindCSS 从零开始 - 增加 Base 样式

什麽是 Base 样式 概念有点像是 CSSreset,现在网页基本上都会使用 CSS reset...

无线网路篇(Wi-Fi)

今天内容跟我原本预期的,出入满多QQ 因为先前有买一的书,叫「黑客大揭秘 近源渗透测试」, 本来打算...

Angular 客制弹出视窗

因为个人的 blog 需要一个弹出视窗做提示,而套件里的样式我都不喜欢,所以今天就来客制化一个吧!...

C# 入门之逻辑判断(下)

前面我们介绍了简单的条件逻辑运算符,现在我们来看一下另外一种条件判断 ———— if. 在前面的判断...