{{ 'fb_in_app_browser_popup.desc' | translate }} {{ 'fb_in_app_browser_popup.copy_link' | translate }}

{{ 'in_app_browser_popup.desc' | translate }}

目錄 購物車 {{currentCart.getItemCount()}}
商品總數的上限為 100 件,請調整數量再點擊購買

oplate App 分享區

 

銀髮樂活  /  職能治療  /  運動健身  /  程式教育  /  app客製化

 

程式教育 > 基礎課程 > Lesson06 / 小黑盤的基本控制01

課程大綱

1.  BLE擴充元件匯入
2.  藍芽連線

 

課程內容

1.  連線的過程是從清單中選取要連線的對象,連線成功後按鈕顏色會變成藍色。
     請看以下示範影片。

2.  開始製作前我們需要先下載AI2的低功耗藍牙BLE擴充元件:  BluetoothLE.aix

3.  請大家先開一個新專案,名稱是「Lesson06」,App名稱為「藍芽連線」。

     左方「元件面板」中有「Extension」擴充元件,點擊「Import extension」匯入擴充元件。

4.  點擊「選擇檔案」,選擇下載的BLE擴充元件,再按「Import」。

5.  然後在「Extension」裡就會出現「BluetoothLE」擴充元件了。

6.  接下來準備好小黑盤,開始連線吧~

     先從「元件面板」中拉進「清單選擇器」。
     將「元件屬性」裡的「文字」和元件名稱都改為「連線清單」。
     字體大小改為30。

7.  再將「BluetoothLE」擴充元件拉進手機中。
     「BluetoothLE」擴充元件跟「計時器」一樣都是非可視元件。

8.  然後我們進到「程式設計」頁面。
     從「Screen1」裡拉進「當”Screen1”. 初始化 執行」程式方塊。

9.  從「BluetoothLE1」裡拉進「呼叫”BluetoothLE1”. StartScanning」程式方塊。
     這組合起來意思是說,只要一進到這個頁面,就呼叫「BluetoothLE1」這個元件開始掃描周遭的藍芽設備。

10.  從「BluetoothLE1」裡拉進「當”BluetoothLE1”. DeviceFound 執行」程式方塊。

11.  從元件「連線清單」裡拉進「設”連線清單”. “元素字串”為」程式方塊。

12.  從「BluetoothLE1」裡拉進「”BluetoothLE1”. “DeviceList”」程式方塊。
       這段程式方塊組合是說,當元件「BluetoothLE1」找到周遭的藍芽設備後,清單選擇器元件「連線清單」就會將這些搜尋到的藍芽設備一一列出來。

13.  到目前為止做的是先「搜尋」藍芽設備 → 再將藍芽設備製成一份「清單」。
       當點擊元件「連線清單」時就會出現搜尋到的所有藍芽設備清單,我們再從清單裡選出要連線的目標(這裡就是小黑盤)。

       * 下圖為點擊「連線清單」時出現的手機畫面。
          選項中有出現oplate的就是小黑盤。oplate後六個英文字母和數字的組合就是這個小黑盤的ID。每個小黑盤都有自己的ID,會標示在小黑盤底部。
          oplate前面那堆是地址,每個小黑盤也不一樣。

14.  從元件「連線清單」裡拉進「當”連線清單”. 選擇完成 執行」程式方塊。

15.  選擇好要連線的小黑盤後,我們就要開始進行連線的動作。

       從「BluetoothLE1」裡拉進「呼叫”BluetoothLE1”. ConnectWithAddress 地址」程式方塊。
       然後透過「地址」來跟藍芽設備連線,但地址在哪呢?

16.  還記得上圖的手機畫面嗎?
       我們的選項中就包含「地址」,只要想辦法將「地址」和其他資訊(譬如ID)分開,就能使用了。

       那要怎麼分開呢?
       仔細觀察後發現資料間有「空格」。
       而「內件方塊」中「文字」裡的「用空格分解」程式方塊可以把一串文字用其中的空格去分開,並依序做成一個清單,如圖。
       分出來的「清單項目1」這就是我們要的地址。
       成功了,等下我們就用「用空格分解」程式方塊來製作吧。

17.  首先,加入一個變數,名稱就叫「地址」好了。
       因為地址是一串英文字母和數字,所以這個變數的性質是「文字」。我們拉進一個空白初始值。

18.  拉進一個「設置”地址”為」。
       接下來依照上述的方法設定這個變數「地址」為「用空格分解」後的清單裡的「清單項目1」。

19.  完成後的組合如圖所示。
       總共有4種程式方塊,分別在哪裡可以找到呢?(提示: 和它們的顏色有關喔。)

20.  上面程式方塊組合的步驟說明。

21.  這個變數「地址」就是我們連線要用到的地址。
       把它加上去就OK了。

22.  連線”步驟”已經完成了,但我們不確定是不是有連線”成功”。(有很多原因會導致連線失敗,所以之後要把可能會造成連線失敗的情況考慮進去,目前先不用。)

       所以需要想辦法告訴我們連線”成功”了。
       我們這裡用的方法是用不同的顏色顯示是否連線成功。

       拉進一個「當”BluetoothLE1”. Connected 執行」。

23.  「當”BluetoothLE1”. Connected 執行」程式方塊是說當連線成功後我們要執行什麼事。
       在這裡當連線成功後,我們要讓「連線清單」的背景顏色變成藍色。
       這樣當「連線清單」按鈕變藍色時我們就知道連線成功了。

24.  完整程式設計如圖。
       到此大功告成,趕快匯出試玩看看吧!