[ Intel Edison ] 透過 App Inventor 呼叫 API 開關 LED

前置準備作業

1. 準備 Intel® Edison 開發板

2. 準備 Arduino Breakout Board

3. 準備 Grove LED

4. 組裝 Intel Edison 、 Arduino Breakout Board 與 LED 並連接到電腦 ( LED 接 D5 )

Intel Edison 與 Arduino Breakout Board 連接圖

Intel Edison 端

請參考 透過 API 開關 LED - Python

App Inventor 端

• Step 1. 登入 App Inventor

  http://ai2.appinventor.mit.edu/

• Step 2. 新增專案

  Projects -> Start New Project

• Step 3. 建立專案名稱

• Step 4. 建立 LED 開關按鈕與 Web Viewer

  從左邊的 User Interface 拉 2 個 Button 到 Viewer 中

  從左邊的 User Interface 拉 1 個 Web 到 Viewer 中

• Step 5. 改變 Button 名稱

  點選 Components 中的 Button1 更名為「Open」

  點選 Components 中的 Button2 更名為「Close」

• Step 6. 更改 Button 顯示名稱

  點選 Componets 中的「Open」按鈕，在到右邊的 Properties 中的 Text 更改顯示名稱為「開啟」

  點選 Componets 中的「Close」按鈕，在到右邊的 Properties 中的 Text 更改顯示名稱為「關閉」

• Step 7. 點選畫面右上角的 Blocks

• Step 8. 建立一個存放 IP 位置的全域變數

  Variables -> initialize global name to

• Step 9. 將 global 取名

  將 name 的地方取一個變數名稱代替，如 url_base

• Step 10. 輸入 IP 位置

  從左邊的 Blocks 區塊中的 Text 取得第一個方塊並輸入 IP 位置

• Step 11. 設定 Open 按鈕的點擊動作

  點選左邊的 Blocks 中的 Open 按鈕並點選第一個方塊

• Step 12. 設定要呼叫的 API

  點選左邊 Blocks 中的 Web1 元件並選擇 set Web1 url to 的元件

點選左邊的 Blocks 中的 Text 並點選 join 元件

點選左邊的 Blocks 中的 Variables 並點選 get 元件

點選左邊的 Blocks 中的 Text 並點選第一個方塊，輸入「/api/v1.0/led」

• Step 13. 設定 RequestHeaders

點選左邊的 Blocks 中的 Web1 並點選 set Web1 RequestHeaders to 元件

點選左邊的 Blocks 中的 List 並點選 make a list

點選左邊的 Blocks 中的 Text 並點選第一個方塊，輸入「Content-Type」與「application/x-www-form-urlencoded」

• Step 14. 設定 API 傳入參數

點選左邊的 Blocks 中的 Web1 並點選 call Web1.PostText text

點選左邊的 Blocks 中的 Web1 並點選 call Web1.BuildRequestData list

點選左邊的 Blocks 中的 List 並點選 make a list

點選左邊的 Blocks 中的 Text 並點選第一個方塊，輸入「turn」與「on」

• Step 15. 將剛才建立的 Open 按鈕的動作複製一份，並修改成 Close 的按鈕事件

將 Open Click 改成 Close Click

更改呼叫 API 的傳入參數，將原本的 on 改為 off

• Step 16. 打包程式

  點擊 Connect -> AI Companion

Android 端

• Step 1. 到 Google Play 下載 MIT AI2 Companion

• Step 2. 開啟 MIT AI2 Companion

• Step 3. 輸入 Six Character Code 並按下 connect with code

結果畫面

點擊「開啟」按鈕

點擊「關閉」按鈕

List of blogs

• https://github.com/ArcherHuang/MyBlog