輕鬆體驗~ MIT App Inventor 設計 App 透過 BLE 來玩 micro:bit

目的：學習App Inventor設計Android手機的App並透過 BLE 來玩 micro:bit...

準備環境：
1.MacBook 或 Windows筆電(此篇用Windows10筆電示範)
2.micro:bit板(可外接電池盒)
3.Android手機(需要USB線連接)
4.MIT App Inventor 2(網頁版)

閱讀官方文件：
MIT App Inventor於今年釋出的 extension ( http://iot.appinventor.mit.edu/#/microbit/microbitintro ) 如下：
  • Microbit_Accelerometer: 讀取 accelerometer 產生的 Accelerometer_X (number, in milliG), Accelerometer_Y (number), Accelerometer_Z (number)
  • Microbit_Button: 讀取 A, B buttons (0 - up按, 1 - down放, 2 - long pressed長按)
  • Microbit_Io_Pin: read/write digital (0 or 1) or analog (0 to 255) pins
  • Microbit_Led(有提供sample): 輸出 5x5 LED matrix
  • Microbit_Magnetometer: 讀取 magnetometer 產生的 Magnetometer_X (number, in milliT), Magnetometer_Y (number), Magnetometer_Z (number)
  • Microbit_Temperature(有提供sample): 讀取 temperature in Celsius攝氏溫度
  • Microbit_Uart: send/receive the software serial port (UART) interface

從官方範例來實作：
  1. Microbit_Led：
首先，依據pdf說明文件，到micro:bit官網影片( https://makecode.microbit.org/reference/bluetooth/bluetooth-pairing )準備 Android 手機及 micro:bit 的藍牙配對(PAIRING MODE!)，成功配對如下圖...


再來，依據pdf說明文件( https://drive.google.com/file/d/0B51cwz24uqobanJ2XzhLbGpQOFk/view )，進入MIT App Inventor網站( http://ai2.appinventor.mit.edu )，新增一個專案 project 名稱 BasicIoTSetup，如下圖...


陸續從 Palette區塊拖拉 元件 至 Viewer 區塊，並調整其 Components 及 Properties...(自從Delphi之後, 我超喜歡這樣的GUI拖拉介面...)
在此，官方文件並沒有詳述清楚細節，建議可從 .aia範例檔查看...

再從官網 ( http://iot.appinventor.mit.edu/assets/edu.mit.appinventor.ble.aix ) 下載 BluetoothLE extension 並  匯入...如下圖...


再到 Blocks Editor Viewer 拖拉相關的程式積木...(此時，可以思考 事件event 彼此間的關係及順序)
最後，將 Android手機(要先安裝 MIT AI2 Companion)接上USB線插上筆電，執行 MIT AI2 Companion，並在 App Inventor 執行 Connect/AI Companion，如下圖...









其中，我偷偷加上了 Microbit_Accelerometer 元件來顯示 X, Y, Z...
源碼連結：https://drive.google.com/file/d/0B_4eUrknq7N1U0g0dTNSQXpXM28/view?usp=sharing

     2. Microbit_Temperature：
相關實作步驟如pdf說明文件，如下是手機畫面擷圖...





如此，就可以輕輕鬆鬆做出 手機App 了...還真的很好玩!!

後記：
我本來是看到micro:bit官網介紹的App -- micro:bit Blue ，好奇地想要去玩它及研究 BLE...那知道學下去後發現一堆堆的問題，只好下苦功去看官方文件，之後竟然被牽到 App Inventor...遂留下此篇記錄!!

參攷：
1.MIT App Inventor + Internet of Things -- Platform: BBC micro:bit, http://iot.appinventor.mit.edu/#/microbit/microbitintro
2.Bitty Software, http://www.bittysoftware.com/

留言

張貼留言