2021年6月14日 星期一

手機程式設計——App Inventor II 點擊恐龍(含手耭連結測試)

 手機程式設計——App Inventor II 點擊恐龍(含手耭連結測試)

MIT 行動學習中心已發表 App Inventor 2 (本文後簡稱 AI2),
將其整合在網頁中即可使用,可說是與 Scratch 愈來愈像了。

使用上非常簡單,只要連結到下列網址
http://ai2.appinventor.mit.edu/
再以google帳號(本校學生郵局帳號)登入即可。

登入後,我們就以科丁小學課本的程式範例,
~點到手抽筋~
來作一個開場練習。


在這個程式裡,我們要設計一隻能開口、閉口的恐龍,
當按了開始鈕後,在一定時間內(10秒),
恐龍被按壓時,會張口;放開按壓時,會閉口,
程式會自動記錄,在時間內,恐龍被按壓的次數。

在畫面編排中,我們用到了幾個基本元件,條列如下:
按鈕—>開始按鈕
圖像—>恐龍圖片(開口、閉口)
(文字)標籤—>顯示次數及時間

比較特別的是,為了讓所有文字標籤能放在同一行,
我們在介面配置中,選用了水平配置,來達成這一目的。

最後,為了要有計時的功能,
我們再加入感測器元件中的計時器

將上述元件依序排列後,調整各自必要的屬性及內容,
就完成如上圖中的畫面編排

接下來,我們再根據程式運作需求,
繼續進行程式設計的內容。

程式主要可分成3大部分。

一、起始設定及開始按鈕

一開始,我們先設定2個全域變數:次數時間
開始按鈕按下後,程式便開始執行
並將次數與時間的值,設給文字標籤

二、計時器運作時機

當時間變數 >0的情況下,計時器會啟動運作,並倒數計時(每次0.1秒)
當到時間變數=0時,計時器停止作用。

三、點擊恐龍的判斷及反應

實際上,計時器是從恐龍第1次被點選時,才開始啟動的。
在時間範圍內,只要恐龍被點到,就會顯示開口圖像,
並且點擊次數會加1,一直到時間結束為止。

當程式設計完成後(或是在設計過程中),
如果我們想連接手機,測試一下成果,
你必須先在手機上安裝AI Companion的APP程式。
(Adroid系統—>google play商店 ;iOS系統—>apple store)

然後在AI2的設計畫面中,點選連線功能中的AI Companion選項

此時,電腦會顯示一個QRcod的連結圖,如下:

接著,我們就可以開啟手機上的AI Companion APP,
按Scan QR code,就可以執行我們所設計出來的手機程式了。

在執行過程中,如果有任何問題,都可以隨時修正,
修正完便可立即看到結果喔!非常方便。


如果程式已經設計完成,
我們就可以用下列的方式,來安裝到手機中。


或下載到電腦,再轉傳到手機裡安裝,如下。




那萬一,我們沒有手機可以測試怎麼辦?
那就請看下一篇手機模擬器的教學文吧!

手機程式設計——App Inventor II 模擬器安裝與執行