繪製地圖 ( 控制移動 )

這篇文章延續「繪製地圖 ( 二維陣列 )」文章，搭配更多的清單和變數的操作方式，實作按下鍵盤的上下左右，控制大型地圖的移動。

相關文章參考：

• 繪製地圖 ( 清單轉換 )
• 繪製地圖 ( 二維陣列 )

開啟範例

開啟「繪製地圖 ( 二維陣列 )」的範例，從這個範例進行修改。

範例連結：https://scratch.mit.edu/projects/568624603/

積木程式原理 ( 上下移動 )

開啟範例後，新增一個名為「向上移」的函式，勾選「執行完畢再更新畫面」。

「向上移」函式主要處理 map 清單的順序，編輯完成函式後，設定按下「向上」鍵時，執行函式：

• 將 map 清單的最後一個項目，移動到第一個項目 ( 插入到第一個項目，然後刪除最後一個項目 )。
• 執行「顯示」函式。

重複上述的步驟，新增一個名為「向下移」的函式，勾選「執行完畢再更新畫面」，設定按下「向下」鍵時，執行函式。

• 將 map 清單的第一個項目，移動到最後一項 ( 將第一項添加到最後一項，然後刪除第一項 )。
• 執行「顯示」函式。

完成後，點擊綠旗，按下鍵盤的上與下，就能控制地圖往上移動或往下移動。

這個範例設計成按下「向上」鍵時地圖會往下移動，按下「向下」鍵時地圖會往上移動，因為之後會在地圖中放入角色，控制角色往下或往上時，地圖會以反方向移動。

積木程式原理 ( 左右移動 )

新增一個名為「向左移」的函式，勾選「執行完畢再更新畫面」。

左右移動必須要控制二維陣列的第二層 ( 取出 map 的項目，再由項目拆出來的清單 )，所以「向左移」函式必須針對這部份做清單的處理：

• 新增一個變數 a，設定為 1，表示從 map 的第一個項目開始。
• 使用重複積木，map 有幾個項目就重複幾次，每次重複執行：
  • 執行「拆字」函式，將取出的項目拆成 list 清單。
  • 將 list 清單的最後一個項目，移動到第一項。
  • 將變數 a 增加 1。

能夠處理 list 清單後，新增一個「合併 list 為文字」的函式，勾選「執行完畢再更新畫面」。

為什麼要將 list 合併為一串文字呢？因為 Scratch 的清單只能存入文字或數字，所以必須要轉換成文字，再將文字存入 map。

編輯「合併 list 為文字」的函式：

• 新增變數 b 為 1，表示從 list 的第一項開始。
• 新增變數 text 為「空」值 ( 不能包含空白 )，負責處理字串組合。
• 使用重複積木，list 有幾個項目就重複幾次，每次重複執行：
  • 判斷如果 b 小於 list 的長度，表示項目不是最後一項，進行字串組合時，加上逗號。
  • 如果 b 等於 list 長度，表示項目是最後一項，直接進行字串組合。
  • 將 b 增加 1。

設定按下「向左」鍵時，執行「向左移」函式，接著修改「向左移」函式：

• 執行「合併 list 為文字」函式。
• 將 map 的指定項目，替換成合併後的 text 文字。
• map 的個項目都處理之後，執行「顯示」函式。

重複上述的步驟，新增一個「向右移」的函式，勾選「執行完畢再更新畫面」，並將修改函式內容，將 list 的第一項移動到最後一項。

完成效果

完成後，點擊綠旗，按下鍵盤的上下左右，就能控制地圖的移動。

範例解答

範例解答：繪製地圖 ( 控制移動 )

繼續閱讀

如果已經熟悉了繪製地圖 ( 控制移動 ) 的程式，就可以繼續閱讀「繪製地圖 ( 角色與牆壁 )」的文章。

文章連結：繪製地圖 ( 角色與牆壁 )

意見回饋

如果有任何建議或問題，可傳送「意見表單」給我，謝謝～