iT邦幫忙

2021 iThome 鐵人賽

DAY 30
0
自我挑戰組

micro:bit 從入門到精通系列 第 30

Day30 ( 遊戲設計 ) 貪吃蛇

貪吃蛇

教學原文參考:貪吃蛇

這篇文章會介紹如何使用「陣列」、「函式」、「變數」、「點亮」、「[計次迴圈」、「邏輯判斷」等積木,在 micro:bit 實作一個貪吃蛇小遊戲。

相關文章參考:陣列函式變數計次迴圈點亮邏輯判斷

遊戲方式

貪吃蛇是一款復古的像素小遊戲,遊戲開始時,畫面中會有「一點」的蛇和「一點」的蛋,蛇會不斷的移動,使用者需要控制蛇左轉或右轉的方向去吃到蛋,每吃到一顆蛋蛇就會變長「一點」,蛋也會更換位置,如果蛇撞到牆壁則遊戲結束。

如果使用 micro:bit 實作,遊戲操作步驟如下:

  • 同時按下 AB 按鈕,開始遊戲 ( 或重新遊戲 )。
  • 按下 A 按鈕,控制蛇左轉。
  • 按下 B 按鈕,控制蛇右轉。
  • 蛇吃到蛋之後會變長一點。
  • 蛇撞到牆壁後,遊戲結束,顯示得分

micro:bit - 貪吃蛇

積木程式原理

一開始,先把遊戲啟動的所有變數定義好:

  • 當啟動時,新增 run 變數為 0,表示遊戲尚未開始。
  • 當按鈕 A+B 按下時:
    • 變數 run 設定為 1,表示遊戲開始。
    • 變數 turn 設定為 0,表示蛇移動的方向 ( 0 右、1 下、2 左、3 上 )
    • 變數 dx 設定為 1,表示蛇每次移動 x 改變的數值。
    • 變數 dy 設定為 0,表示蛇每次移動 y 改變的數值。
    • 變數 x 設定為 0,表示蛇頭的 x 座標。
    • 變數 y 設定為 0,表示蛇頭的 y 座標。
    • 變數 egg_x 設定為 0,表示蛋的 x 座標。
    • 變數 egg_y 設定為 0,表示蛋的 y 座標。
    • 變數 list_x 設定為陣列,預設 1 個項目,項目為變數 x,表示蛇身體 x 座標陣列。
    • 變數 list_y 設定為陣列,預設 1 個項目,項目為變數 y,表示蛇身體 y 座標陣列。
    • 變數 score 設定為 0,表示得分。
    • 變數 time 設定為 1000,表示蛇移動的速度 ( 每 1000 毫秒移動一格 )。

micro:bit - 貪吃蛇

控制蛇左右轉的方式,取決於 turn 的數值,所以可以透過按下 A 或 B 按鈕,改變 turn 的數值,例如* turn 等於 1 的時候,蛇往下移動,按下 A 按鈕 tune 等於 0,蛇就往右邊移動 ( 左轉 )*。

micro:bit - 貪吃蛇

接著設計「蛇移動」的程式,蛇移動包含一個 move 函式和一個重複無限次迴圈。

  • move 函式內容:
    • 判斷 turn 如果等於 0,表示向右移動,dx 設定 1,dy 設定 0
    • 判斷 turn 如果等於 1,表示向下移動,dx 設定 0,dy 設定 1
    • 判斷 turn 如果等於 2,表示向左移動,dx 設定 -1,dy 設定 0
    • 判斷 turn 如果等於 3,表示向上移動,dx 設定 0,dy 設定 -1
    • 根據 dx 和 dy 的數值,得到最後 x 和 y 的數值結果。
  • 重複無限次積木:
    • 清空畫面,關閉所有 LED 燈。
    • 呼叫 move 函式。
    • 根據執行 move 函式之後所得到的 x 和 y,點亮對應 xy 座標的 LED
    • 暫停 time 毫秒再次重複執行。

micro:bit - 貪吃蛇

完成後,啟動 micro:bit,就能用 A 和 B 按鈕控制蛇移動的方向。

micro:bit - 貪吃蛇

能夠控制蛇的移動方向之後,接著修改重複無限次積木,加入蛇吃到蛋的邏輯判斷:

  • 新增邏輯判斷,判斷 run 的 1 的時候開始遊戲。
  • 加入另一個邏輯判斷,判斷蛇的 x 和 y 等於蛋的 egg_x 和 egg_y 數值,表示蛇吃到蛋。
  • 吃到蛋的時候:
    • 將 x 和 y 的數值,分別添加為 list_x 和 list_y 陣列的第一個項目
    • 重新設定蛋的 egg_x 和 egg_y 數值。
    • 分數 score 增加 1。
    • 暫停時間減少 ( 蛇的移動速度增加 )。
  • 沒吃到蛋的時候:
    • 將 x 和 y 的數值,分別添加為 list_x 和 list_y 陣列的第一個項目。
    • 移除 list_x 和 list_y 陣列的最後一個項目 ( 因為沒有吃到蛋,陣列長度就不會改變 )。
  • 使用「計次迴圈」,讀取 list_x 和 list_y 陣列的所有數值,根據這些數值點亮對應的 LED
  • 點亮蛋的 LED ( 放在後面是為了避免蛋被蛇的身體遮住 )

micro:bit - 貪吃蛇

最後新增一個重複無限次積木,設計「蛇撞到牆壁,遊戲結束」的程式:

  • 判斷如果 x<0 ( 撞到左邊 ) 或 x>4 ( 撞到右邊 ) 時,run=0 遊戲結束並顯示分數。
  • 判斷如果 y<0 ( 撞到上面 ) 或 y>4 ( 撞到下面 ) 時,run=0 遊戲結束並顯示分數。

micro:bit - 貪吃蛇

完成後,啟動 micro:bit,就可以開始進行貪吃蛇的遊戲。

micro:bit - 貪吃蛇

範例解答

範例解答:貪吃蛇

實作「貪吃蛇」的小技巧

  • 為什麼要使用「陣列」呢?

    因為貪吃蛇的身體由很多個 LED 組成,每個 LED 都有各自的座標,透過操作陣列來插入或刪除座標,是相當方便的。

  • 為什麼不使用「遊戲積木」呢?

    因為遊戲積木的「角色」,會影響整個畫面的顯示,反而容易讓程式變得不容易理解。

關於我

大家好,我是 OXXO,是個即將邁入中年的斜槓青年,如果對我有點興趣(笑,可以與我聯繫,一起來做點有玩又有創意的東西吧!


上一篇
Day29 ( 遊戲設計 ) 太鼓達人
下一篇
Day31 ( 電子元件 ) 閃爍的 LED 燈
系列文
micro:bit 從入門到精通46

尚未有邦友留言

立即登入留言