Google MIT App Inventor使用教學

App Inventor 原是Google實驗室（Google Lab）的一個子計畫，在2012年1月1日移交給麻省理工學院行動學習中心，並已於3月4日以MIT App Inventor名稱公佈使用，所以當我們在Google上搜索App Inventor時，出現MIT App Inventor，別懷疑，這就是我們要的內容。

1. 連結至MIT App Inventor網站

2. 進入後點選紅框內的連結準備開始使用

3. 雖然Google是交給MIT來開發，但是帳號還是使用Google的，所以在使用前我們必須先擁有一個Google帳號，若沒有的話請先自行申請，在此由於我們已經擁有Google帳號，所以網頁會請我們選擇一個要使用的Google帳號，選則好後就按下Allow

4. 稍等一會就進入了App Inventor的使用畫面了，基本這也是一個Web Application的應用，所有程式開發的動作都可以透過瀏覽器完成，由於第一次使用並沒有建立過任何App，所以就先點選紅框內的New來新增一個App

5. 首先填入App的名稱，在此填入TestApp，按下OK

6. 接著就可以看到我們新增的App專案了，點選紅框內的選項就準備進入開發介面囉

7. 等了一下開發介面就出現了，基本的內容有左邊紅框內的各種元件，以及中間紅框內的螢幕空間，讓我們可以將需要的元件從左邊紅框內拖至中間螢幕空間內

8. 在此我們從左邊拖曳Button及Label兩個元件至中間螢幕空間內，完成後會看到右邊Components的紅框內多出了我們剛剛拖曳的兩個元件，假設我們已經將App所需要的元件配至好了，接著就是要來編輯每個元件的功能，按下右上角紅框內的按鈕準備進入編輯介面

9. 按下按鈕後，系統會先請我們下載一個Java元件，我們就將檔案進行存檔

10. 檔案下載完後就執行它

11. 可能會遇到作業系統防火牆阻擋，就按下允許存取的按鈕

12. 由於我們並沒有安裝任何Android的模擬器，所以在此我們就按取消

13. 出現Error沒關係，按下OK繼續動作

14. 此時會跳出一個獨立的視窗讓我們作業

15. 首先我們先點選My Blocks，此時下面會出現我們剛剛所使用到元件，Button1與Label1

16. 接著我們點選Button1，右邊會出許多Button1可以執行的動作，我們點選第一個，也就是Button1被按下時會觸發的動作

17. 選擇好後會出現如下圖的畫面

18. 接著我們要選擇Label1的動作，一樣點選Label1後右邊會現Label1可以執行的動作，點選set Label1.text to這個動作，就表示要將原本Label1中所顯示的字串Label1改成別的字串

19. 同樣的，選擇好後會出現如下圖讀畫面，此時有兩個向拼圖的元件在畫面上

20. 既然是像拼圖，那我們就把這兩個拼在一起吧，拼在一起後會像下圖所示

21. 接著我們點選Built-In的頁籤，然後點選Text選項，會出現Text可以使用的動作，我們點選第一個，準備要來修改Label1 Text的內容

22. 一樣將text元件跟剛剛Button及Label的元件拼在一起，如下圖所示

23. 接著點紅框內的內容準備來作修改

24. 將文字內容改成Hellp App World，這樣就完成了簡單的應用程式，從拼圖的結果來看，我們這個應用程式就是，當我們按下Button1時，會去Set Label1的Text內容，Text內容就會被改變成Hello App World，是不是很簡單呢，不用寫任何程式碼就可以完成一個Android App

25. 完成後要準備來下載App，先回到原本的畫面，如下圖，點選右上角紅框內的按鈕，然後選擇Download to this Computer

26. 再來當然就是把我們開發好的App存在電腦內囉，存好後請自行將App上傳至Android系統的智慧型手機內

27. 要在手機上安裝我們自己開發的App，首先要進行安全設定，因為我們的App並不是從Google Play上直接下載的，先打開手機的設定頁面，點選紅框內的選項

28. 然後將未知的來源這個項目打勾，表示我們允許安裝非Google Play下載來的App

29. 再來當然就是安裝我們寫好的App囉，點選安裝

30. 安裝好後就開啟來看看吧

31. 畫面是不是跟我們剛剛編排的一樣呢，按下Button1來看看

32. 瞧，Label1的Text是不是變成Hello App World了，這樣就表示我們的第一個Android App成功囉