7. 章節3: 利用App Inventor 2控制 Micro:bit¶
7.1. 簡介¶
App Inventor 2 是一個類似Makecode的積木型編程平台，能夠幫助初學者輕易地建立一個在Android或是IOS使用的APP。
裡面包含各種功能的元素，例如按鈕、拖拉條、日期選擇器、圖片、相機、傳感器、網頁瀏覽器等，只需要拖拉及簡單編程即可使用。
你可以嘗試用App inventor 2去建立一個使用網絡連接的IoT App程式來控制Micro:bit。當Micro:bit配合上IoT:bit使用互聯網控制功能時，這會一直監聽互聯網中傳來的訊息，然後執行相應的行為。所以可以在智能電話上實現一些遙控的功能，像打開LED開關等。
7.2. API 應用程式介面 (control command)¶
什麼是API? API全稱 '應用程式介面' ， 所指的是應用程式與應用程式之間溝通的橋樑。
而 『URL』 是其中一種在網絡上所通用的API，專門負責在網絡上帶領使用者存取指定的網絡資源，常見的有我們所輸入的網址，像www.google.com， 就能夠帶領我們前往google的網頁。
在IoT:bit上提供了一個專門用於Micro:bit互聯網控制功能的API，只需要在API中填入IoT:bit的 『專屬ID』 及 『要發送的訊息』 ，即可以對Micro:bit作出控制。
(1) 基本 API:
https://control.smarthon.cc/publish?id=DeviceID&msg=ControlCommand
id: IoT:bit的獨立ID， 用於區分及選擇要控制/進行溝通的IoT:bit
msg: 要傳送的訊息
例子: 「https://control.smarthon.cc/publish?id=0x123456781&msg=lighton」.
在這裡我們傳送 lighton 訊息到ID為 0x123456781 的IoT:bit
(2) 進階API:
https://control.smarthon.cc/publish?id=DeviceID&msg=ControlCommand&value=Value
id: IoT:bit的獨立ID， 用於區分及選擇要控制/進行溝通的IoT:bit
msg: 要傳送的訊息
value: 要額外傳送的數值
例子: 「https://control.smarthon.cc/publish?id=0x123456781&msg=lighton&value=500」
和基本API的例子裡一樣，這裡我們傳送 lighton 訊息到ID為 0x123456781 的IoT:bit，但額外增加了一個500的數值，讓Micro:bit知道開燈的亮度
7.3. 場景例子¶
目標:
這例子裡將會使用App inventor 2製作一個App來控制Micro:bit開關LED
解釋:
這例子裡分為兩部分:
第一部分，我們需要連接Micro:bit到網絡及取得其ID
第二部分，我們需要設計一個簡單的App去發送API
7.4. 第一部分: 編程¶
目標:
我們需要先取得Micro:bit的ID及設定好接收訊息後的行為
連接圖:
連接LED到P0
請把蜂鳴器開關 「上拉」 以斷開連接
第一步驟:連接Wi-Fi
在使用互聯網控制功能之前，需要先確保已連接上網絡
第二步驟:取得ID
『當Wifi連接後』 是一個事件處理器.當連接上Wi-Fi後，這個處理器會把取得的IP地址及裝置的ID都以變量的形式提供。因此可以利用這來取得裝置的ID來進行互聯網控制。
初始化OLED顯示屏
在
當Wifi連接後裡添加顯示字符串，並把ID放進去
*如你害怕忘記了ID，亦可以在互聯網控制那分頁取得裝置ID，並按需要在某時候顯示出來
第三步驟:按訊息執行動作
當連接上Wi-Fi後，與控制伺服器的連接將會自動建立，可以接收訊息。
若要提取接收到的訊息，可以使用 『當從互聯網接收到指令』 來讀取訊息。然後依照訊息來執行不同的動作。
在
當從互聯網接收到指令在添加如果條件式在設定條件時，對接收到的訊息進行對比，是否與我們設定的指令相同
當接收到
Pin_On時，把LED打開當接收到
Pin_Off時，把LED關閉
*注意，指令是需要區分大小階的
第四步驟:顯示指令
在接收指令時，或者有需要把指令顯示出來以方便知悉。
初始化OLED顯示屏
添加
顯示字符串並把指令顯示出來
進階應用:指令+數值
有時侯除了指令外，亦可能需要同時附加一個數值來控制，例如控制舵機轉動角度，LED燈的亮度等。
這時侯需使用另一個事件處理器 當從互聯網接收到指令及數值 ，就能夠同時讀取指令及數值，並依此進行操作。
完整答案
MakeCode: https://makecode.microbit.org/_JUDFLu75zDFV
你可以在以下網頁下載HEX檔案:
7.5. 第二部分: App Inventor 2 設定¶
目標:
我們需要利用App inventor 2製造一個App 去通過API控制Micro:bit第一步驟: 設計面板
建立一個新專案，切換到Designer板面
在 『Layout』 ，拖動 『HorizontalArragement』 到面板上
在 『User Interface』 ，分別拖動 『Button』 兩次到 『HorizontalArragement』
在 『Connectivity』 裡，拖動 『Web』 到面板上
第二步驟:定義功能
切換到 『Block』 板面
按以下圖片拖出功能塊
當 Button 1和Button 2被按下的時候，呼叫API來發送訊息
http://control.smarthon.cc/publish?id=
DeviceID&msg=ControlCommand
進階使用:發送帶數值的指令
如果你想進行帶數值的控制，可以建立一個文字輸入區塊來輸入數值，並在發送訊息把數值一并傳出。介面:
編程:
當button 3被按下時，會讀取文字區塊的數值，并呼叫能傳送數值的API
http://control.smarthon.cc/publish?id=0xfa240ac45917&msg=PinValue&value=600
第三步驟:組建APP
組建並打包APP後進行測試
如果在智能電話上安裝了AI Companion程式，App Inventor 2能夠讓你進行實時測試
此外，亦能夠直接下載APK檔案以進行安裝及測試
7.6. 結果¶
當Wi-Fi連接後，裝置的ID將會顯示出來
簡易情況:
當Button 1被按下時，將會發送 「Pin_on」 的指令到指定ID的Micro:bit。
當Micro:bit接收到指令後，將會打開在P0的LED。
如按下Button 2，則會發送 「Pin_Off」 ，而Micro:bit則會把LED關燈
使用數值控制:
當使用Button 3時，Micro:bit會依照文字區塊的數值(0或600)來控制LED。
