App Inventor 角色左右移動 + 跳躍 功能 前篇

前陣子有介紹過，讓在畫布上的圖像角色，做左右移動及跳躍的教學，今天要示範將兩個功能給合起來。

那麼請跟著以下的教學：

---

1. 開啟 App Inventor，並新增一個專案「MarioJump」。

要新增的元件有點多，所以我們先上傳素材，等等新增元件時，再一併設定屬性。

點我下載素材

下載完後把所有素材上傳到 App Inventor

接著開始新增元件

主要元件為畫布、圖像精靈(我拉了十六個磚塊、一個 Mario)、六個計時器及三顆按鈕。

標籤元件我當間距用，高度都為 10 像素。

---

圖像精靈可以不用拉到那麼多，但起碼要十個，因為每個人模擬起來寬度都不盡相同，如果磚塊太少，可能會看到地板鋪不滿的情況。

看到那麼多計時器先不用慌，腦袋放空就好，因為每個實作都很簡單。

---

接著來設定屬性

首先先從 Screen1 開始好了

Screen1 設定：

設定畫面為橫向、設定背景圖片為 BackGround.jpg

畫布元件設定：

設定背景顏色、高度 66 %、寬度 56 %

圖像精靈元件設定：

所有磚塊的圖片都設為 g.jpg、只有 Mario 設為 marioRight.png

g.jpg 的高寬都是 32 像素、marioRight and marioLeft 為 40 x 34

P.S. 整個範例實作完我才發現，我都在程式區使用任意元件了！在那裡一併設定圖片就好，結果我居然還一個一個手動設定…… 哈哈哈

對話框元件設定：

都透明~~~

計時器元件設定：

To Be Continued…

預計 2021/10/30 新增後篇教學

---

如果覺得文章內容還不錯的話，麻煩請幫我點個讚！感謝

可以多點幾次喔~~

第一次點讚需使用 Google 或 Facebook 帳號註冊