Category Archives: AppInventor – 圖形化Android

[ 教學文 ] 深度剖析:如何在QNAP上架設App Inventor私服器

作者/攝影

文/林祥瑞

文字整理/CAVEDU 宗諭

圖/CAVEDU教育團隊

文章分類教學技術文

App Inventor原來是Google實驗室(Google Lab)的一個子計畫,由一群Google工程師,以及勇於挑戰的Google使用者共同參與。App Inventor是一個完全線上開發的Android程式環境,拋棄複雜的程式碼,而使用樂高積木式的堆疊法,來完成使用者的Android程式。Google實驗室後於2012年1月1日,將App Inventor整個計畫移交給麻省理工學院行動學習中心進行維護,並維持免費及開放原始碼的精神繼續運作。

圖1 App Inventor原來是Google實驗室(Google Lab)的一個子計畫

 

使用App Inventor其實相當直覺、方便,開發一個App Inventor程式,就從使用者的網路瀏覽器展開!使用者首先要設計程式的外觀;接下來是設定程式的行為,這部分就如同玩樂高積木般簡單有趣。最後,只要將手機與電腦連線,剛出爐、熱騰騰的程式就會出現在使用者的手機上了。

圖2 App Inventor的設計介面

 

正因使用起來簡易、直覺、方便,連小學生也能使用App Inventor撰寫手機應用程式,所以,App Inventor被相當程度應用於教育領域。在台灣,有不少關於App Inventor的課程,以CAVEDU教育團隊為例,一年至少有30至40場的研習。正因持續辦理研習,CAVEDU團隊在教育現場發現了一些使用App Inventor的問題和需要,而這正是本文將教導在QNAP上架設App Inventor私服器的主要原因。

圖3 在App Inventor設定程式的行為,如同玩樂高積木般簡單有趣。

 

為何要在QNAP上架設App Inventor私服器?

因著推廣App Inventor,CAVEDU教育團隊在研習過程中發現,許多學校的教室能夠讓學生上網,但在使用App Inventor時,因為每位使用者皆需一定的網路頻寬,而教室的網路頻寬並不足以應付這麼多學生,往往導致教室的網路斷線,眾人都連不上網路。

 

除了在教育現場發現上述問題外,為了想知道App Inventor使用者究竟在做些什麼,例如,在課堂上教導學生製作一個程式,大家普遍會使用什麼樣的元件?然而,因麻省理工學院行動學習中心的App Inventor伺服器上的資料不對外公開,若是自己架設一台App Inventor私服器,便能有效獲得前述問題的答案,掌握使用者行為,進行大數據分析。

圖4 自己架設一台App Inventor私服器, 便能有效掌握使用者行為,進行大數據分析。

 

至於為什麼要將App Inventor私服器架設在QNAP上,主要原因是學校等教育機構時常在管理資訊技術及大量的教師與學生資料上面臨挑戰,往往需要以有限的預算建置儲存平台,以實現檔案共用與更精簡的管理,而QNAP正提供了很好的解決方式。

圖5 在QNAP上自行架設App Inventor私服器

 

基於以上幾點原因,所以,CAVEDU教育團隊不僅在有需要時自己架設App Inventor私服器,也盼望藉由這篇文章的分享,讓更多人可以在QNAP上自行架設App Inventor私服器,不僅避免了網路頻寬不足的問題,更進一步掌握使用者行為,甚至還有更多的應用!

圖6 CAVEDU教育團隊所維護的「App Inventor中文學習網」

 

以下,我們將一步步向您示範,如何在QNAP上架設App Inventor私服器。而下文將介紹到QDK 這個開發者工具,若想更多了解QDK,歡迎收看這段影片:

 

編譯 MIT AppInventor 伺服器

準備工作

專案仰賴兩個重要工具,一是我們藉由git 版本控制工具獲取原始碼;二是我們需要Apache Ant執行自動化組建,我們確認環境已經安裝。

 

apt-get install ant git  # Debian/Ubuntu

pacman -S apache-ant git # Arch Linux

dnf install ant git      # RHEL/Fedora

 

此外,執行伺服器需要 Google App Engine for Java 的工具,請到下載頁取得最近版本,本文截稿前的版號是 1.9.63 。

 

# 移到家目錄

cd ~/ 

 

# 使用指令下載檔案的範例,請自行修改版號

wget ‘https://storage.googleapis.com/appengine-sdks/featured/appengine-java-sdk-x.y.zz.zip’ 

 

# 解壓縮檔案

unzip appengine-java-sdk-x.y.zz.zip

 

組建伺服器

獲取原始碼

MIT AppInventor 專案寄託在GitHub,每位參與者都必須透過 git 提交程式碼,我們自然也是用 git 來下載所有原始碼。

 

# 獲得原始碼

git clone https://github.com/mit-cml/appinventor-sources.git

 

# 進入專案目錄

cd appinventor-sources/appinventor

 

# 下載子模組

git submodule init

git submodule update

 

上述有 git submodule 相關的指令,在有些專案這不是必要步驟,由於 AppInventor 的原始碼有引用其他專案,我們必須透過這些指令把引用的專案一併下載下來。

 

GitHub 不僅僅是來放置原始碼的空間而已,同時也作爲對開發者友善的工作環境,開發者可以在討論區回報臭蟲後者討論新功能,此外提供Pull request機制,當你想對專案提報你的修改,只要去他的專案上發送 pull request ,經專案負責人審查通過,你的修改就會被併入原始碼。

 

執行編譯

執行 ant 指令就行了,就像呼吸一樣簡單。由於專案相當龐大,所有編譯流程至少耗時三分鐘以上,直到 BUILD SUCCESSFUL 字樣出現即編譯成功。

 

ant

 

如果你不幸編譯失敗,最後跑出 BUILD FAILED 字樣,建議回前面步驟再三確認有沒有遺漏。在你重新編譯前,先執行 ant clean 清理前一次組建留下來的垃圾再執行 ant 。

 

執行伺服器

開始前先提醒 AppInventor 並非單一的程式,我們總共會開啓兩個不同的伺服器,除了 App Engine 寫成的網頁伺服器之外,還有一個專門打包 apk 檔案的伺服器,我們在 AppInventor 網頁上寫成的程式必須透過打包伺服器來編譯成 apk 檔案。

 

啓動網頁伺服器

這時候就是 App Engine 出馬的時機了,如果已經依照前面步驟下載好工具,我們用它的工具啓動本地的伺服器。

 

~/appengine-java-sdk-x.y.zz/bin/dev_appserver.sh –address=127.0.0.1 –port=8888 appengine/build/war

 

啓動後開啓瀏覽器進入網址 http://127.0.0.1:8888/ 來檢查是否有登入頁面。

–address=127.0.0.1 伺服器的位置 綁定 在代表本機的特殊 IP 位置 127.0.0.1 ,只能在本機使用,若要允許外部連線,可以考慮改成 –address=0.0.0.0 。

–port=8888 表示伺服器使用 8888 埠口來提供服務,你也可以改成其他的數字。

 

啓動 apk 打包伺服器

我們再開啓另外一個終端,透過 ant 指令幫啓動打包伺服器。

 

# 進入專案目錄

cd ~/appinventor-sources/appinventor/

 

# 啓動打包伺服器

ant RunLocalBuildServer

 

在 QNAP NAS 執行 MIT AppInventor

準備工作

編譯 AppInventor

進入正題之前,我們得確認已經下載 Google App Engine ,且 AppInventor 已經編譯完成,操作方式請參考文章「編譯 MIT AppInventor 伺服器」。之後的段落我們假定幾個配置好的目錄如下:

 

  • ~/appinventor-sources/ 包含已經編譯好的 AppInventor 程式。

  • ~/appengine-java-sdk-x.yy.zz 爲解壓縮的 Google App Engine SDK for Java ,版號請自行填入。

 

下載 QPKG 打包工具

一般而言,打包 QPKG 過程中必須根據 QNAP 公司提供的 QPKG 開發手冊 撰寫套件設定檔,並使用他們提供的 QDK 開發工具打包套件。這部分我們提供已經寫好的設定環境,請使用 git 下載。

 

cd ~/

git clone https://github.com/jerry73204/appinventor-qpkg.git

 

在我們的設定環境下有兩個目錄:

 

  • package-source/ 檔案結構是根據 QPKG 開發手冊的內容配置,屆時要打包進入 QPKG 套件的檔案都放置於此。

  • qnap-chroot/是引用他人的 chroot 環境,可以幫我們在本機即可完成QPKG打包,而不需要透過QNAP NAS機器。

 

目錄結構的說明如下,其說明請參考 QPKG 開發手冊

appinventor-qpkg/

├── package-source/

│   ├── package_routines/

│   ├── qpkg.cfg                 # 套件設定檔

│   ├── icons/                   # App 圖示

│   │   ├── appinventor_80.gif

│   │   ├── appinventor.gif

│   │   └── appinventor_gray.gif

│   └── shared/                  # 安裝於各類 NAS 的檔案目錄

│       ├── appinventor.sh       # 服務控制腳本,可命令啓動、關閉 AppInventor 服務

│       ├── run_appinventor.py   # 啓動 AppInventor 伺服器的腳本

│       └── run_buildserver.py   # 啓動 apk 打包伺服器的腳本

└── qnap-chroot/

 

準備 QPKG 套件

帶入 Google App Engine for Java

考慮到 QNAP NAS 上面沒有預載 Google App Engine ,必須一併打包到套件裏面。

 

cd ~/appinventor-qpkg/shared/

cp -rv ~/appengine-java-sdk-x.y.zz/ appengine-java-sdk/

 

帶入編譯好的 AppInventor

編譯完成的 AppInventor 檔案相當龐大,我們只需要其中包含網頁伺服器及打包伺服器的兩個目錄,因此做工會細一點。

 

# 準備 AppInventor 目錄

cd ~/appinventor-qpkg/shared/

mkdir appinventor-bin/

cd appinventor-bin/

 

# 複製 AppInventor 網頁伺服器

mkdir -p appengine/build/

cp -rv ~/appinventor-sources/appinventor/

appengine/build/war appengine/build/war/

 

# 複製 apk 打包伺服器

mkdir -p buildserver/build

cp -rv ~/appinventor-sources/appinventor/

buildserver/build/run buildserver/build/run/

 

完成準備

這段告一個段落前,我們再三檢查一下套件目錄是不是如下方式配置。

package-source/

├── appengine-java-sdk/

├── appinventor-bin/

│   ├── appengine/build/war/

│   └── buildserver/build/run/

├── appinventor.sh

├── run_appinventor.py

└── run_buildserver.py

 

編譯 QPKG 套件

起手式

根據 QPKG 開發手冊的做法,我們必須在 NAS 上面安裝 QDK 開發工具,把我們的套件工作目錄 package-source 傳到 NAS 上面之後方能打包。不過,作者常常有手邊沒有 NAS 機器的困擾,本文介紹 chroot 的技巧,可以在你的本機創造一個模擬 QNAP NAS 的環境(這裏聲明 chroot 不是 虛擬機),我們在此環境下打包 QPKG 套件。

 

這部分感謝 plexinc 這位大大在 GitHub 提供了 qnap-chroot 工具,讓我們省去不少設定 chroot 環境的功夫,我們也引用在 qnap-chroot 目錄下。

 

準備並進入 chroot 環境

準備工作我們需要完成兩件事,一是掛載 devtmpfs 至下面的 /dev 目錄下,再者是要把做好的 package-source 目錄複製一份到 chroot 環境下。

 

cd ~/appinventor-qpkg/

 

# 掛載 devtmpfs

mkdir -p qnap-chroot/dev

sudo mount –bind /dev qnap-chroot/dev

 

# 複製套件目錄

cp -rv package-source/ qnap-chroot/package-source/

 

完成準備工作後便可以進入 chroot 環境。

 

sudo chroot –userspec=$(id -un):$(id -gn) qnap-chroot/

 

打包 QPKG 套件

這步驟也會花許久時間,請耐心等候。

 

# 更改 PATH 環境變數

export PATH=/bin:/usr/bin:/sbin

 

# 打包套件

cd package-source/qbuild

 

一旦打包成功, qbuild 指令會生成一個 build 目錄放置我們的 qpkg 套件,完成後離開 chroot 環境。

 

ls build/  # 得到檔名 appinventor_2.0.0.qpkg

exit

 

清理 chroot 環境

完成工作後,當然得有始有終把之前設定好的 chroot 環境清理乾淨。

 

# 取出 QPKG 套件

mv qnap-chroot/package-source/build/appinventor_2.0.0.qpkg .

 

# 清理工作檔

rm -rf qnap-chroot/package-source/

 

# 卸載 devtmpfs

sudo umount qnap-chroot/dev

 

在 NAS 上安裝 QPKG 套件

啓動 App Center

首先我們進入 NAS 的管理界面,啓動 App Center 程式。

 

安裝 JRE 套件

由於我們的套件相依於 Java 程式,我們點選左邊選單的 Developer Tools ,然後點選並安裝 JRE 。

 

手工安裝 AppInventor 套件

點選在 App Center 右上角有一個手工安裝的圖示。

 

在跳出的小視窗上點選我們提供的 QPKG 檔案,然後點選安裝,這步驟會花點時間,請耐心等待。

 

安裝完畢後,在 App Center 選單就會出現 AppInventor 選項,點選選項即可進入 AppInventor 界面。

 

相關文章

[新品介紹]MIT App Inventor Codi Bot物聯網教學互動機器人

作者/攝影曾吉弘
文章分類產品介紹
時間
成本
難度*  (1~10)
材料表

對於會寫程式的人來說,Python/C/Java是完全不同的程式語言。但對於沒接觸過的人來說,通通都是一樣的:很可怕。因此程式語言需要一個圖騰來代表,例如,Scratch的那隻小貓、 Linux的企鵝、Java的咖啡,以及Android的小機器人⋯⋯等等,在相關場合中,我們都可以看見這樣的代表符號。

    MIT App Inventor去年發起了一項募資計畫,目標是加速App Inventor 的 iOS版本。贊助$1500美金以上者可以收到一套實體的物聯網教育套件,但這時大家對於內容還不是很清楚應該如何規劃。Hal Abelson教授就問是否可以幫忙?

當然可以啦,不就是為了幫忙才去MIT的嗎?

輪型或多足型機器人設計相關課程算是CAVEDU教育團體的專長,但MIT App Inventor小組盼望能結合它們的新logo,因為之前的logo太Android了,所以他們於去年推出了新的小蜜蜂logo,與Android 3.0 honeycomb 相當神似。

經過一番努力之後,MIT App Inventor Codi Bot 誕生了!

圖1

MIT App Inventor Codi Bot在設計上有幾項重點:

可愛、易用、教育、可擴充

特色:

為了讓使用者更易入手,我們開發了 LinkIt 7697 的 App Inventor extension,(個人覺得比Arduino 101的好用多了)。LinkIt 7697端只要上傳一次程式就可以順利與App Inventor溝通,也就是使用者只要專心寫App Inventor程式即可。如果在辦短期營隊或是體驗活動的時候,可以先把LinkIt 7697準備好,這樣可以省去現場上傳程式的各種麻煩事。

核心使用 LinkIt 7697Robot Shield V2.0,這樣使得整理電線變得很輕鬆,國內也有許多團隊使用兩者開發出許多有趣的專題。

當然,Codi Bot能做的不只是如此,7697 可以結合 MediaTek Cloud Sandbox等雲端服務結合LINE、IFTTT等通訊軟體

 

教學文件:

  • 單機執行:直接執行 (影片)
  • LED:使用按鈕、滑桿來控制翅膀與底座的LED (影片)
  • 翅膀:使用按鈕、滑桿來控制翅膀(伺服機) (影片)
  • 聲音:控制蜂鳴器發出各種音符或自訂義頻率與時間長度 (影片)
  • 完整app:整合上述功能 (影片)

來看實體照片吧,LED亮起的時候真的很漂亮,影片中可以看到翅膀拍動以及發出聲音的效果。

 

圖2

 

圖3 背面

 

圖4側面

    開發過程中,非常感謝聯發科技實驗室MiniPlan,CAVEDU同仁的超強後勤。

7697 extension感謝林祥瑞袁佑緣兩位小超人,以及MIT App Inventor Codi Bot的設計者:游允赫老師。

比較一下 MIT App Inventor的logo 與 Android 3.0 honeycomb:

圖5 App Inventor的logo

 

圖6 Android3.0 honeycomb

 

相關文章:

[ App Inventor + Microbit ] RGB LED控制

本文要介紹如何使用App Inventor來控制 micro:bit的 I/O腳位,以 RGB LED作為輸出應用。(原始碼下載請按我)

請務必先讓您的手機與Micro:bit進行藍牙配對,否則無法正確執行本範例。

作者/攝影  曾吉弘
時間  2小時
成本
難度 * * *
材料表
  • 個人電腦
  • App Inventor開發環境
  • 支援BLE的Android手機
  • BBC Micro:bit開發板
  • RGB LED燈

 

 

硬體清單

本範例所使用的RGB LED實際上是把紅綠藍三色的LED整合到同一個元件中,並且有陰極共用與陽極共用兩種規格。本範例使用的是共陰 RGB LED。以下是本專題的硬體清單:

  • BBC micro:bit 微控制板, 1
  • 麵包板, 1
  • 跳線, 4
  • RGB LED (共陰), 1

 

注意:如果您使用共陽RGB LED的話,最長腳要接到 micro:bit 的 3.3V腳位,並且 App Inventor 端給 1 會讓腳位變成低電位,這與共陰的行為剛好相反

 

 

範例影片

 

請根據以下資訊來連接Micro:bit RGB LED:

Micro:bitRGB LED (共陰)
GNDGND (最長腳、灰線)
P0R (紅線)
P1G (綠線)
P2B (藍線)

完成如下圖。

您可使用鱷魚夾或把線彎成U形來勾住Micro:bit腳位上的圓孔,當然後者比較容易鬆脫囉。

App Inventor

本範例要示範使用 app 來控制接在 micro:bit 腳位上的 RGB LED 發出四種不同的顏色。首先請登入 MIT App Inventor 並建立一個空白專案。.

 

以下步驟是根據App Inventor IoT分站上的基本範例開始一步步加入本專題所需的元件,當然也可以直接下載完整的 .aia。

 

首先要加入本專案所需的擴充檔。

  • 左側Palette區中,找到最下方的Extension,點選”Import extension” → “URL
    • 貼上micro:bit extension的網址: http://iot.appinventor.mit.edu/assets/com.bbc.micro:bit.profile.aix
  • 新增一個Microbit_IOpin元件,設定其BluetoothDevice屬性為”BluetoothLE1” (別忘啦!)

接著加入本範例所需的元件:

  • 新增一個TableArrangement元件
    • 設定寬度為”Fill parent“、高度為”200 pixels“,row(列數)為2,最後設定column(行數)為3
    • 設定其Visible屬性為false,我們會在與micro:bit建立連線之後讓它顯示出來,才能點選按鈕來發送藍牙指令。
  • 新增五個按鈕到tablearrangement元件,將其文字分別改為”Red“, “Green“, “Blue“, “White“與”Off“對應不同的LED動作。

調整之後,您的畫面應該會類似下圖。有一點點不同沒關係,背景顏色、位置與顏色都可以修改,喜歡就好!

 

Blocks

 

STEP 1:連線後要求更新腳位狀態

BluetoothLE1.Connected事件中,我們顯示連線確認訊息,並設定micro:bit腳位為”digital output“,這是因為我們要控制RGB LED所以得這麼作。在此會用到三個Microbit_Io_Pin.ConfigurePin指令,分別設定pinNumber為0, 1, 2 (代表micro:bit的P0, P1與P2腳位),analog欄位設為false,input欄位設為false

仔細來看看Microbit_Io_Pin.ConfigurePin指令,它有三個參數:pinNumber (腳位編號), analog (true代表類比模式,false代表數位模式),input (true代表輸入,false為輸出)。

所以下圖是把micro:bit P0腳位設定為”數位輸出(digital output)“,可連接像是LED、繼電器這種數位輸出元件。更多micro:bit I/O腳位的詳細設定請參考:http://microbit.org/guide/hardware/pins/

下圖則是設定micro:bit P2腳位為”類比輸入(analog input)“。可連接旋鈕電位計、光敏電阻等元件。o this pin.

STEP2: 更新LED狀態的副程式

為了讓程式意讀易懂,我們使用副程式來管理控制micro:bit腳位狀態的多個指令。新增一個副程式(procedure),改名為”ledControl”。

 

接著點選藍色小齒輪來新增三個參數,分別改名為”r”, “g”, “b”。顯然這三個參數是用來代表micro:bit用來控制RGB LED的腳位狀態。

在副程式中加入三個Microbit_Io_Pin.WriteOutputPinData指令,每一個分別控制micro:bit一隻腳位的狀態。因此第一個指令請設定pinNumber為0,pinValue為 r 參數值。後兩者以此類推,完成如下圖:

STEP2: Button to light up red

按下Button_R按鈕會讓RGB LED亮起紅燈,作法是呼叫ledControl副程式並設定參數為(1, 0, 0),代表P0為高電位(1),P1 / P2 為低電位(0)。

STEP3: other buttons for different colors

另外四個按鈕的差別只在於參數差異,這樣您應該可以感受到使用副程式的號處了吧:

  • Button_G: (0, 1, 0) 亮起綠色
  • Button_B: (0, 0, 1) 亮起藍色
  • Button_W: (1, 1, 1) 亮起白色
  • Button_Off: (0, 0, 0) 熄滅.

STEP4: 中斷藍牙連線

點選ButtonDisconnect按鈕會中斷藍牙連線,會讓app回到初始狀態並等候下次連線。

操作

完成啦!請確認您的Android裝置與 micro:bit 已經藍牙配對好了。接著從App端去連線到 micro:bit,連線成功後會出現五個按鈕,點選不同按鈕就可以看到RGB LED亮起紅綠藍白四種顏色與熄滅,如果亮起的顏色不對或是無法亮起請再次檢查接線是否鬆脫與腳位順序是否正確。

 

小挑戰

  1. 試著讓RGB LED更繽紛,例如紅色與藍色腳位同時點亮,就是紫色的光芒喔。
  2. 加入SpeechRecognizer元件,用語音來控制RGB LED。

 

 

相關文章:

[App Inventor IoT] LinkIt 7697使用BLE(藍牙4.0)傳送光感測器數值

作者/攝影  袁佑緣
時間  1小時
成本
  • 約900元
難度  * *
材料表
  • LinkIt 7697
  • LinkIt 7697擴充板
  • Grove光感測器
  • micro usb線
  • 電腦

本文章教各位讀者如何用手機撰寫App Inventor的應用程式,並透過Buletooth Low Energy來得到遠端LinkIt 7697的光感測器讀值。

 

App Inventor Extension 安裝

請先進到App Inventor的網站,並建立一個專案,在左下角Extension的部份,點選import extension,如下圖。

並把從MIT App Inventor Extensions網站(http://appinventor.mit.edu/extensions/)上的BLE套件裝上去。

如果讀者想要直接取用本範例的aia檔也可以,這樣就不需要再手動安裝Extension,因為已經包含在aia檔中了。

 

本範例的aia檔請到此處下載-連結

 

 

App Ineventor 程式設計 

首先請確認您有按照前面的步驟將BLE元件新增App Inventor中,如下圖。

接下來請看到Desginer的部份,Connect按鈕是用來連接到指定藍牙MAC位址的7697,連上之後就會變成Disconnect按鈕,可以用來斷掉連接的藍牙。而最底下的有一個label元件用來顯示感應器的數值。

接下來看到後台的Blocks端,首先我們要先定義一個addr的變數,用來指定要連接的LinkIt 7697的MAC address,至於這個MAC address會根據每一塊不同的板子而有所不同,請讀者按照待會Arduino程式設計的部份所顯示的MAC Adress填入正確的位址。

再來當按鈕connect按下去之後,就會嘗試連上指定MAC address的控制板,如果成功的話,按鈕就會切換到Disconnect,以等待下一次使用者按下時就會斷線。

 

如果連接成功的話,應用程式的標題就會切換成Connected,反之則顯示Unconnected。

接下來是本範例的重點部份,如果此刻的狀態是正確連接的話(也就是按鈕是顯示用來Disconnect的狀態),Clock元件每隔一段時間就會啟動一次接收BLE訊息的服務,而這個服務會透過指定的Service跟Characteristic讀到7697上的光感測器數值(提醒讀者這邊的UUID務必確認跟Arduino程式碼端的設定一樣喔),最後當App讀到BLE的Int值時(when BluetoothLE1.IntValueRead),就會將數值顯示在Label元件上,讓使用者可以在手機螢幕上看到光感值!

 

LinkIt 7697 程式設計

請打開Arduino IDE,並確定您的控制板在編輯器中切換成7697,再上傳以下的程式碼到7697上。

本範例的ino檔請到此處下載-連結

#include <LBLE.h>
#include <LBLEPeriphral.h>

int item;

LBLEService AService("19B10010-E8F2-537E-4F6C-D104768A1214");
LBLECharacteristicInt ARead("19B10011-E8F2-537E-4F6C-D104768A1214", LBLE_READ | LBLE_WRITE);

void setup()
{
  Serial.begin(9600);
  LBLE.begin();
  while (!LBLE.ready()) { delay(100); }
  Serial.println("BLE ready");

  Serial.print("Device Address = [");
  Serial.print(LBLE.getDeviceAddress());
  Serial.println("]");

  AService.addAttribute(ARead);

  LBLEPeripheral.addService(AService);
  LBLEPeripheral.begin();
  LBLEAdvertisementData advertisement;
  advertisement.configAsConnectableDevice("BLE Ana");
  LBLEPeripheral.advertise(advertisement);


}


void loop()
{
  item = analogRead(A0);
  Serial.println(item);
  ARead.setValue(item);
  delay(1000);
}

成功上傳本隻程式碼到7697上後,請打開Serial Monitor,7697將會印出這塊板子的MAC Address,請務必記得把這段位址修改到App Inventor端的addr變數上喔。

 

 

範例影片

 

相關文章:

[ App Inventor IoT ] LinkIt 7697使用 BLE(藍牙4.0)控制伺服馬達

這次向各位介紹常用的雲端服務,分別是台灣聯發科技公司搭配旗下LinkIt系列開發板之MCS與ThingSpeak,我們透過LattePanda實作。你可以從遠端來控制板子的腳位狀態或是檢視板子狀態與感測器的數值變化。類似的雲服務近年來如雨後春筍般冒出來,對於想找尋免費方案的使用者或教學單位來說是相當好的事呢。

作者/攝影  袁佑緣
時間  1小時
成本
  • 約800元
難度  * *
材料表
  • LinkIt 7697*1
  • micro usb線*1
  • 伺服馬達*1
  • 電腦*1
  • Android手機*1

本文章教各位讀者如何用手機撰寫App Inventor的應用程式,並透過Buletooth Low Energy來遙控LinkIt 7697的伺服馬達。

App Inventor Extension 安裝 

請先進到App Inventor的網站,並建立一個專案,在左下角Extension的部份,點選import extension,如下圖。

並把從MIT App Inventor Extensions網站(http://appinventor.mit.edu/extensions/)上的BLE套件裝上去。

如果讀者想要直接取用本範例的aia檔也可以,這樣就不需要再手動安裝Extension,因為已經包含在aia檔中了。

 

本範例的aia檔請到此處下載-連結

 

App Ineventor 程式設計 

首先請確認您有按照前面的步驟將BLE元件新增App Inventor中,如下圖。

接下來請看到Desginer的部份,首先在第一行有TextBox元件,用來顯示現在控制的伺服馬達角度,接下來有兩個按鈕,左邊的connect按鈕主要是用來連線到7697,右邊的Disconnect則是斷線,最後,在最下面有一個滑桿,可以用拖曳來控制馬達的角度(注意因為這邊控制的伺服馬達可控角度為0~180度,所以在Slider元件上要設定最大值為180最小值為0)。

接下來看到後台的Blocks端,首先我們要先定義一個addr的變數,用來指定要連接的LinkIt 7697的mac address,至於這個mac address會根據每一塊不同的板子而有所不同,請讀者按照待會Arduino程式設計的部份所顯示的MAC Adress填入正確的位址。

再來當按鈕connect按下去之後,就會嘗試連上指定mac address的控制板,如果成功的話,滑桿跟計時器就會被啟動。

而斷線的部份則跟連線差不多,只是Enabled跟Disabled的元件會相反。

接下來是本範例的重點部份,Clock元件每隔一段時間就會啟動一次傳送BLE訊息的服務,而這個服務會將滑桿上此刻的數值先轉成整數後透過指定的Service跟Characteristic送出,而在這邊的UUID務必確認跟Arduino程式碼端的設定一樣,7697才能成功接收到數值喔!

LinkIt 7697 程式設計

 請打開Arduino IDE,並確定您的控制板在編輯器中切換成7697,再上傳以下的程式碼到7697上。 本範例的ino檔請到此處下載-連結

 

#include <LBLE.h>
#include <LBLEPeriphral.h>
#include <Servo.h>

Servo my_servo;
int servo_position = 90;

// Define a simple GATT service with only 1 characteristic
LBLEService servoService("19B10010-E8F2-537E-4F6C-D104768A1214");
LBLECharacteristicInt positionCharacteristic("19B10011-E8F2-537E-4F6C-D104768A1214", LBLE_READ | LBLE_WRITE);


void setup() {


  //Initialize serial and wait for port to open:
  Serial.begin(9600);

  // to check if USR button is pressed
  pinMode(6, INPUT);

  my_servo.attach(10);
  my_servo.write(servo_position);

  // Initialize BLE subsystem
  LBLE.begin();
  while (!LBLE.ready()) {
    delay(100);
  }
  Serial.println("BLE ready");

  Serial.print("Device Address = [");
  Serial.print(LBLE.getDeviceAddress());
  Serial.println("]");

  // configure our advertisement data.
  // In this case, we simply create an advertisement that represents an
  // connectable device with a device name
  LBLEAdvertisementData advertisement;
  advertisement.configAsConnectableDevice("BLE Servo");

  // Configure our device's Generic Access Profile's device name
  // Ususally this is the same as the name in the advertisement data.
  LBLEPeripheral.setName("BLE Servo");

  // Add characteristics into servoService
  servoService.addAttribute(positionCharacteristic);

  // Add service to GATT server (peripheral)
  LBLEPeripheral.addService(servoService);

  // start the GATT server - it is now 
  // available to connect
  LBLEPeripheral.begin();

  // start advertisment
  LBLEPeripheral.advertise(advertisement);
}

void loop() {
  delay(300);

  Serial.print("conected=");
  Serial.println(LBLEPeripheral.connected());

  if (digitalRead(6))
  {
    Serial.println("disconnect all!");
    LBLEPeripheral.disconnectAll();
  }

  if (positionCharacteristic.isWritten()) {
    servo_position = positionCharacteristic.getValue();
    Serial.println(servo_position);
    my_servo.write(servo_position);
  }


}

成功上傳本隻程式碼到7697上後,請打開Serial Monitor,7697將會印出這塊板子的MAC Address,請務必記得把這段位址修改到App Inventor端的addr變數上喔。

範例影片:

 

相關文章:

[App Inventor] Microbit磁力感測器控制小蜜蜂圖示

本文章教各位讀者如何用手機撰寫App Inventor的應用程式,並透過Buletooth Low Energy 來取得 Micro:bit 磁力感測器訊號,讓app上的小圖示飛來飛去。

作者/攝影  曾吉弘
時間  1小時
成本
難度  * * * *
材料表
  • 個人電腦
  • App Inventor開發環境
  • 支援BLE的Android手機
  • BBC Micro:bit開發板

 

本文要介紹如何藉由最近非常熱門的BBC Micro:bit開發板上的磁力感測器來控制App畫面上的小圖示轉動。Micro:bit板子上已經具備了BLE藍牙通訊功能,搭配app Inventor寫好的micro:bit extesion,就能有更多互動的效果。

 

範例 aia檔下載請按我

 

藍牙配對

 

Micro:bit端設定:

  1. 同時按住Microbit 正面A、B按鍵,不要放掉
  2. 按住A、B鍵時,把背面的Reset 鍵按下後再放開。
  3. 這時應該可以看到 “PAIRING MODE!” 以跑馬燈方式出現在Microbit LED 螢幕上,若看到這訊息,便可以放開A、B鍵。
  4. PAIRING MODE! 結束後,會看到一個圖形出現在Microbit LED 螢幕上,不同的Microbit 出現的圖案也不同,這是Microbit 不同裝置獨特的”簽名” (Signature) 。

5.這時候的Microbit 已經準備好跟其他裝置配對,請看以下影片教學

 

 

 

Android手機端設定:

  1. 進入Android手機的設定–>藍牙
  2. 確認Micro:bit 已進入配對模式
  3. 當Micro:bit上的‘PAIRING MODE!’ 顯示完,搜尋(每隻Android手機這個選項的文字不一定相同,但意思差不多),應該會看到類似 micro:bit [XXXXX]的選項,其中XXXXX 會根據每片micro:bit而不同。點選該裝置來配對。

4.micro:bit 會出現向左的箭頭,然後Android裝置上會跳出畫面要求輸入配對PIN碼的視窗。

5.按住Micro:bit 的按鍵A ,這時microbit 會連續出現六個數字,這就是配對碼。

6.回到Android裝置上,輸入這六個數字。如果Microbit 出現[V],代表配對成功。如果是[X]代表沒成功,請再試一次。

 

編寫程式來取得Micro:bit磁力感測器

匯入BLE 與 micro:bit extension

 

請登入MIT App Inventor官方網站,建立新專案,在Designer葉面中點選Palette左下角的Extension,再點選”Import extension“與”URL:

  1. 貼入以下兩個 extension link:
  2. 請加入 Microbit_Magnetometer這個元件,這是一個非可視元件。並把它的 BluetoothDevice 屬性設為 “BluetoothLE1″。這步驟很容易忘記,別漏掉了
  3. 加入四個按鈕放入 horizontalArrangement元件中,分別用於掃描、停止掃描連線與斷線
  4. 加入1個顯示訊息用的label,用於顯示連線狀態
  5. 加入一個 ListVeiw,當掃描到鄰近的BLE裝置時會顯示在這裡 (到此與MIT所提供的基礎連線測試程式相同)
  6. 加入一個Canvas,寬高皆為320像素
  7. 在Canvas中加入一個ImageSprite,使用任何您喜歡的圖案都可以,在此使用MIT App Inventor新的小蜜蜂logo。
  8. 最後加入4個顯示訊息用的label,用於顯示連線狀態、X、Y、Z軸與方位角(bearing)

Blocks頁面

  1. 掃描與連線

在此的做法都差不多,先點選ScanButton來掃描鄰近可用的BLE裝置(以本專案來說目標是micro:bit,但當然也會出現其他裝置例如手機筆電之類的)。找到裝置之後就會出現在畫面中的ListView中,選取micro:bit後點選ConnectButton就可以連線(BluetoothLE.Connect指令)。

  1. 連線成功後開始更新磁力感測器值

在此設定更新速度(reporting period) 為20ms,並要求micro:bit開始回報方位角與各軸磁力資料更新。

  1. 顯示磁力偵測值並控制ImageSprite

Microbit_Magnetometer1.MagnetometerBearingReceivedMagnetometerDataReceived事件中,我們取出各參數並顯示於對應的Label。並用X、Z軸數值來控制ImageSprite的X. Y座標,您可以改為其他的軸向資料或用於控制其他的效果,很多效果都可以嘗試。

斷線

斷線時會呼叫 bluetoothLE元件來中斷藍牙連線,確認斷線之後則顯示相關訊息。

完工了!來試試看吧。請確認您的Micro:bit與Android已經配對好了。按下按鈕應該可以看到畫面上有一些數字不斷跳動,試著拿個小磁鐵在Micro:bit附近晃晃(別拿太強的,弄壞我不負責喔),看看數字與小圖案的變化。試試看用 Micro:bit搭配 App Inventor 做出更多功能吧

 

相關文章:

 

 

完成如下圖:

 

[App Inventor IoT] 使用BLE控制LinkIt 7697 LED燈

 

本文章教各位讀者如何用手機撰寫App Inventor的應用程式,並透過Buletooth Low Energy來遙控LinkIt 7697的的LED燈。

作者/攝影  袁佑緣
時間  1小時
成本
難度  * *
材料表
  • LinkIt 7697
  • micro usb線
  • 電腦
  • Android手機

 

App Inventor Extension 安裝

請先進到App Inventor的網站,並建立一個專案,在左下角Extension的部份,點選import extension,如下圖。

並把從MIT App Inventor Extensions網站(http://appinventor.mit.edu/extensions/)上的BLE套件裝上去。

如果讀者想要直接取用本範例的aia檔也可以,這樣就不需要再手動安裝Extension,因為已經包含在aia檔中了。

 

本範例的aia檔請到此處下載(https://drive.google.com/open?id=0B0HNqd_8V0OlNjJDTGx0dVNKOTg)。

(建議先下載後重新上傳到app inventor tw的檔案庫上)

 

App Ineventor 程式設計

首先請確認您有按照前面的步驟將BLE元件新增App Inventor中,如下圖。

接下來請看到Desginer的部份,connect按鈕主要是用來連線到7697的,而下面有兩個按鈕,分別用來控制LED燈的ON跟OFF。

接下來看到後台的Blocks端,首先我們要先定義一個addr的變數,用來指定要連接的LinkIt 7697的mac address,至於這個mac address會根據每一塊不同的板子而有所不同,請讀者按照待會Arduino程式設計的部份所顯示的MAC Adress填入正確的位址。

再來當按鈕connect按下去之後,就會嘗試連上指定mac address的控制板,如果成功的話就,按鈕就會切換到Disconnect,以等待下一次使用者按下時,就會斷線。

至於定義連線時與斷線時的功能有哪些,則是用下面的when block來決定,只有成功連線時,才能夠控制控制LED的開關。

接下來是本範例的重點部份,當按下ON/OFF開關時,會透過BLE元件的WriteIntValue來傳送訊息給7697,並且是已經指定好service跟characteristic的uuid了,而這個uuid其實是跟Arduino端裡面寫的UUID是一致的,詳情請看下面的範例程式碼。

 

而我們送出的整數數值1或者是0則分別代表LED是要亮或者是暗。

 

LinkIt 7697 程式設計

本範例程式可以在Arduino IDE的範例code上找到,請先確定您的控制板在編輯器中切換成7697,再點選Files->Examlpes->LBLE->SimplePeripheral。

/*
  This example configures LinkIt 7697 to act as a simple GATT server with 1 characteristic.

  To use it, open AppInventor project:

    * 

  Build & install it on Android id

  created Mar 2017
*/
#include <LBLE.h>
#include <LBLEPeriphral.h>

// Define a simple GATT service with only 1 characteristic
LBLEService ledService("19B10010-E8F2-537E-4F6C-D104768A1214");
LBLECharacteristicInt switchCharacteristic("19B10011-E8F2-537E-4F6C-D104768A1214", LBLE_READ | LBLE_WRITE);

void setup() {

  // Initialize LED pin
  pinMode(LED_BUILTIN, OUTPUT);
  digitalWrite(LED_BUILTIN, LOW);

  //Initialize serial and wait for port to open:
  Serial.begin(9600);

  // to check if USR button is pressed
  pinMode(6, INPUT);

  // Initialize BLE subsystem
  LBLE.begin();
  while (!LBLE.ready()) {
    delay(100);
  }
  Serial.println("BLE ready");

  Serial.print("Device Address = [");
  Serial.print(LBLE.getDeviceAddress());
  Serial.println("]");

  // configure our advertisement data.
  // In this case, we simply create an advertisement that represents an
  // connectable device with a device name
  LBLEAdvertisementData advertisement;
  advertisement.configAsConnectableDevice("BLE LED");

  // Configure our device's Generic Access Profile's device name
  // Ususally this is the same as the name in the advertisement data.
  LBLEPeripheral.setName("BLE LED");

  // Add characteristics into ledService
  ledService.addAttribute(switchCharacteristic);

  // Add service to GATT server (peripheral)
  LBLEPeripheral.addService(ledService);

  // start the GATT server - it is now 
  // available to connect
  LBLEPeripheral.begin();

  // start advertisment
  LBLEPeripheral.advertise(advertisement);
}

void loop() {
  delay(1000);

  Serial.print("conected=");
  Serial.println(LBLEPeripheral.connected());

  if (digitalRead(6))
  {
    Serial.println("disconnect all!");
    LBLEPeripheral.disconnectAll();
  }

  if (switchCharacteristic.isWritten()) {
    const char value = switchCharacteristic.getValue();
    switch (value) {
      case 1:
        digitalWrite(LED_BUILTIN, HIGH);
        break;
      case 0:
        digitalWrite(LED_BUILTIN, LOW);
        break;
      default:
        Serial.println("Unknown value written");
        break;
    }
  }


}

成功上傳本隻程式碼到7697上後,請打開Serial Monitor,7697將會印出這塊板子的MAC Address,請務必記得把這段位址修改到App Inventor端的addr變數上喔。

範例影片

([Appinventor ]使用手機BLE控制7697 LED燈)

 

相關文章:

 

 

[App Inventor+Microbit小專題 ] LED控制

作者/攝影  曾吉弘
時間  3小時
成本
難度  * * *
材料表
  • 個人電腦
  • App Inventor開發環境
  • 支援BLE的Android手機
  • BBC Micro:bit開發板

本文要介紹如何讓App Inventor 透過 BLE 來與最近非常熱門的BBC Micro:bit開發板互動。Micro:bit板子上已經具備了BLE藍牙通訊功能,搭配app Inventor寫好的micro:bit extesion,就能有更多互動的效果。本範例修改自 MIT App Inventor IoT網站之 Micro:bit範例

範例 aia檔下載請按我

藍牙配對

 

Micro:bit端設定:

  1. 同時按住Microbit 正面A、B按鍵,不要放掉
  2. 按住A、B鍵時,把背面的Reset 鍵按下後再放開。
  3. 這時應該可以看到 “PAIRING MODE!” 以跑馬燈方式出現在Microbit LED 螢幕上,若看到這訊息,便可以放開A、B鍵。
  4. PAIRING MODE! 結束後,會看到一個圖形出現在Microbit LED 螢幕上,不同的Microbit 出現的圖案也不同,這是Microbit 不同裝置獨特的”簽名” (Signature) 。

  1. 這時候的Microbit 已經準備好跟其他裝置配對,請看以下影片教學

 

 

 

Android手機端設定:

1.進入Android手機的設定–>藍牙

2.確認Micro:bit 已進入配對模式

3.當Micro:bit上的‘PAIRING MODE!’ 顯示完,搜尋(每隻Android手機這個選項的文字不一定相同,但意思差不多),應該會看到類似 micro:bit [XXXXX]的選項,其中XXXXX 會根據每片micro:bit而不同。點選該裝置來配對。

4.micro:bit 會出現向左的箭頭,然後Android裝置上會跳出畫面要求輸入配對PIN碼的視窗。

5.按住Micro:bit 的按鍵A ,這時microbit 會連續出現六個數字,這就是配對碼。

6.回到Android裝置上,輸入這六個數字。如果Microbit 出現[V],代表配對成功。如果是[X]代表沒成功,請再試一次

編寫程式來控制Micro:bit LED matrix

匯入BLE 與 micro:bit extension

 

請登入MIT App Inventor官方網站,建立新專案,在Designer葉面中點選Palette左下角的Extension,再點選”Import extension“與”URL:

  1. 貼入以下兩個 extension link:

 

2. 請加入 Microbit_Led 這個元件,這是一個非可視元件。並把它的 BluetoothDevice 屬性設為 “BluetoothLE1″。這步驟很容易忘記,別漏掉了

  1. 加入四個按鈕放入 horizontalArrangement元件中,分別用於掃描、停止掃描連線與斷線
  2. 加入一個說明訊息用的 label
  3. 加入一個 ListVeiw,當掃描到鄰近的BLE裝置時會顯示在這裡
  4. 新增一個 TextBox,在此輸入我們希望 micro:bit呈現的英文字(中文不行喔)
  5. 新增兩個按鈕,一個是 [Write to LED] 把 Textbox 內容丟給 micro:bit ,一個是[DrawSmiley],讓 Micro:bit 呈現我們所指定的點陣圖案。

Blocks頁面

  1. 掃描與連線

  1. 畫笑臉副程式

在此用一個副程式 DrawSmiley 來代表,我們會用一個 5 x 5 的數字陣列發給 Micro:bit,就能藉此顯示我們想要的圖形。

在此用到的是 Microbit_Led1.WriteLEDMatrixState指令搭配 binary to base 10 指令組合起來的 0101 陣列,1代表 LED亮起,0則是熄滅。仔細看看,這樣就是一個笑臉呢

0 1 0 1 0

0 1 0 1 0

0 0 0 0 0

1 0 0 0 1

0 1 1 1 0

  1. 發送Textbox內容到 Micro:bit

沒錯,就這麼簡單,直接把 Textbox內容透過 Microbit_Led1.WriteLEDText指令發送出去就好,但不能打中文喔

斷線

斷線時會呼叫 bluetoothLE元件來中斷藍牙連線,確認斷線之後則顯示相關訊息。

完工了!來試試看吧。請確認您的Micro:bit與Android已經配對好了。按下按鈕應該可以看到您在 Textbox 中輸入的文字(中文不行喔)以跑馬燈的形式出現在micro:bit 的 LED matrix 上。按下 smilley 按鈕應該也能看到笑臉圖案, 試試看用 Micro:bit LED 搭配 App Inventor 做出更多功能吧

 

相關文章:

 

完成如下圖:

[雙A計畫]藍牙模組(HC05、HC06)常見的指令使用教學

在教到藍牙之間的通訊的課時,常常會搞錯藍牙型號,想寫這篇文跟大家分享,市面上常用的HC-05和HC-06外觀幾乎一樣,不知道如何對藍牙鮑率做設定,想深入研究可以來看看喔。

作者/攝影  許鈺莨
時間  30分鐘
成本
  • 600~800
難度  * * *
材料表
  • 藍牙模組HC-05*1
  • 藍牙模組HC-06*1
  • USB TO TTL線*1
  • Arduino UNO*1

在按照本文中步驟操作時,請讀者一定要購買時請先與商家進行確認以下幾點:

  • 藍牙型號是HC-05還是HC-06
  • 若是已經確認藍牙型號後,請再與商家確認出廠預設鮑率是9600、38400…..等。

如果以上兩點都已確認過,在做藍牙相關設定時會比較快上手,但一切以商家給的文件為主。

接下來教大家如何快速辨別我們買的藍牙是型號是HC-05還是HC-06,還有藍牙指令設定,所以針對以下幾個部分,我以Keyes藍牙的 HC-05和HC-06做範例:
(本文參考instructable藍牙文件、Retun的Blog)

 

  1. 藍牙HC-05和用Arduino UNO 板設定AT指令教學
  2. [進階設定]HC-05主動模式和手機藍牙連線
  3. 藍牙HC-06和用Arduino UNO 板設定AT指令教學
  4. 藍牙HC-05 USB轉TTL模組設定AT指令教學
  5. 藍牙HC-06 USB轉TTL模組設定AT指令教學

1.藍牙HC-05和Arduino UNO 板設定AT指令教學(適合課堂上多人使用)

如果看見藍牙有六隻針腳時,就可能是型號HC-05的藍牙,但是還是要依照以下步驟實際接線測試或與商家確認藍牙型號。

 

設定HC-05的AT指令之前,先與Arduino UNO接線,請先將Arduino的RESET和Arduino的GND接在一起,使得Arduino成為重置模式再依照下方依序接線:

藍牙Arduino UNO
KEY(or En)3.3V
VCC5V
GNDGND
TXDTXD
RXDRXD
STATE不用接

接完線後,將Arduino UNO 用USB連接到電腦,選擇該板子的COM Port,按下Serial Monitor,由於這是Keyes藍牙HC-05的鮑率出廠時預設為38400,所以Serial Monitor的鮑率要選38400,另外一個選項要選NL&CR,即可下AT指令,大小寫不拘。
用藍牙HC-05的好處就是如果設成別的鮑率,之後如果忘記了,在Serial Monitor還是可以固定選38400,再用「AT+UART?」指令查詢,或是設定成別的鮑率。

輸入AT指令第一次會出現ERROR:(0),第二次輸入AT出現OK,即可進入AT模式。

因為HC-05為主從一體(Slave & Master)藍牙,指令多達36種,所以接下來會告訴各位常用的指令。

如果你和我一樣是講師在課堂上教學的話,則一開始這裡有兩個步驟非常重要:

  1. 查詢HC-05 address
  2. 知道自己藍牙的address後改名字

因為在上藍牙通訊時,如果只有兩三位同學的話,還可以一個一個連address測試,但是10幾、20幾位同時在課堂上連線時會搞混,會不知道是不是會連到自己的藍牙,所以要先查出自己藍牙的address的指令,再改藍牙名字。

 

  • 查詢HC-05 address: 「AT+ADDR?」

  • 改名字為CAVEDU: 「AT+NAME=CAVEDU」

  • 查名字 :         「AT+NAME?(確認是否改對)」

  • 改鮑率為9600 : 「AT+UART=9600,0,0」

  • 查鮑率: 「AT+UART? 」

如果改完鮑率請把藍牙電源拔掉再重新接上,再把KEY腳位接上3.3V,新的鮑率設定才會生效

 

  • 設定配對密碼為1234: 「AT+ PSWD=1234」

HC-05還有設定主動模式(Master)的功能,指令如下:

 

  • 設定被動模式: 「AT+ROLE=0」

  • 查詢主/從模式:         「AT+ROLE? 」

  • 設定主動模式: 「AT+ROLE=1」

  • 預設出廠模式: 「AT+ORGL」

如上圖所示,設成出廠模式時,可以用前面所知的AT指令可以查到所有的狀態,包括名字、鮑率、密碼皆已回復。如果之前設成主端(Master),後來也會回復設成從端(Slave)。

 

 

 

  1. [進階設定]HC-05主動模式和手機藍牙連線

既然已經知道如何手動下AT指令設定HC-05為主動模式的話,接下來試著跟手機藍牙連線吧!

既然要和手機連線的話,手機裡就必須先安裝有接收藍牙字串的APP,我是用Android系統的手機,Google paly商店可以搜尋名字為「Bluetooth Terminal」的APP,而在IPHONE的App store也可以搜尋得到一樣名稱的APP,這款APP可以和HC-05雙向溝通。

 

而如何知道手機的藍牙位址,可以由 :設定→關於手機→狀態,知道訊息。

再上一個段落已經知道如何設定HC-05的主動模式了,所以這節以主動連到手機藍牙位址為主。

下列敘述完整步驟,從設定主動模式開始:

 

Step1:切換至主動模式。

輸入指令「AT+ROLE=1」,收到回應「OK」,表示藍牙模組已進入主動模式。

 

Step2:確認藍牙模式。

輸入指令「AT+ROLE?」,收到回應「+ROLE:1」、「OK」,表示當前藍牙為主動模式。

 

Step3:指定藍牙連線至手機連接模式。

輸入指令「AT+CMODE=0」,收到回應「OK」,表示藍牙將連線至手機。

 

Step4:重啟藍牙。

輸入指令「AT+RESET」,收到回應「OK」,表示藍牙重置。

 

Step5:初始化SPP 函式庫。

輸入指令「AT+INIT」,收到回應「OK」,表示藍牙SPP函式庫已初始化。

 

Step6:設定詢問模式。

輸入指令「AT+INQM=1,9,48」,收到回應「OK」

1:RSSI信號強度指示。

9:可以搜尋9個藍牙設備。

48:搜尋時間為48*1.28秒=61.44秒內。

 

Step7:開始詢問,將搜尋周遭藍牙裝置。

輸入指令「AT+INQ」,收到回應「+INQ:12:34:567890:1F1F,7FFF」(該參數為藍牙Address,不同模組Address亦不同)、「OK」。

 

Step8:結束詢問。

輸入指令「AT+INQC」,收到回應「OK」,需要再次輸入指令「AT+STATE?」確認藍牙狀態,若藍牙回應為「+STATE:INQUIRING」、「OK」,代表藍牙未結束詢問,必須回Step4重啟藍牙和Step5初始化SPP 函式庫後,輸入指令「AT+STATE?」,回應為「+STATE: INITIALIZED」,才能成功連線手機藍牙。

 

Step9:綁定連線手機藍牙Address。

輸入指令「AT+BIND=1234,56,abcdef」(在此裝置Address以12:34:56:ab:cd:ef為例),收到回應「OK」。

 

Step10:和手機藍牙連線。

輸入指令「AT+LINK=1234,56,abcdef」

連線後,手機會出現輸入配對密碼1234,表示配對成功,之後就都不需要配對。

當配對成功後,接下來開啟Bluetooth Terminal,先按下「send」後,會出現之前配對成功的裝置清單,選擇之後即可雙向溝通。

下列是配對成功,HC-05和手機雙向溝通的畫面:

3.藍牙HC-06和用Arduino UNO 板設定AT指令教學(適合個人使用)

 

目前的HC-06藍牙會有四條針腳居多,分別是VCC、GND、TX、RX,以下是HC-06的正反面:

HC-06正面                                                                                                          HC-06反面

在設AT指令前,也是先與Arduino UNO接線,只需要接四條線。

和前面HC-05方法一樣,要先將Arduino UNO 的RESET和自己的GND接線,再和HC-06接在一起。

藍牙Arduino UNO
VCC5V
GNDGND
TXDTXD
RXDRXD

 

HC-06出廠後多半都已經設定為從端(Slave),而AT指令只有少數的指令如:密碼、鮑率、姓名….等,以下Arduino UNO Serial monitor示範AT指令,所有AT指令皆要大寫:

 

  • AT測試,回應OK

和HC-05不同的是,因為Keyes的HC-06出廠時預設為9600,所以Serial monitor的鮑率選項要選9600,選擇「沒有行結尾」或「No line ending」。

測試成功後,接下來就是設定其他的AT指令:

 

  • 查詢版本: 「AT+VERSION」

  • 設定名字為CAVEDU02: 「AT+NAMECAVEDU02」

  • 設定密碼為1234: 「AT+PIN1234」

  • 設定鮑率為9600: 「AT+BAUD4」
編號鮑率備註
11200設定鮑率為1200
22400設定鮑率為2400
34800設定鮑率為4800
49600設定鮑率為9600(原廠預設)
519200設定鮑率為19200
638400設定鮑率為38400
757600設定鮑率為57600
8115200設定鮑率為115200

與前篇HC-05最大的不同點是,假設你鮑率已經設成9600,若想要改鮑率或改名時,則你的Serial monitor的鮑率選項要選9600才能成功下AT指令;如果你鮑率已經設成38400,則你的Serial monitor的鮑率選項要選38400才能成功。也就是說,當你設定好之後就要記住自己鮑率是設定多少,否則就要每個鮑率去試試看,不像HC-05有固定鮑率為38400可以容易設定,這也是HC-06最大的缺點。

 

那麼問題來了,大家有沒有發現HC-06的AT指令比較少,並沒有像HC-05一樣有查詢address指令,那上課時怎麼辦呢?

個人較好的做法是在上課前先一一設定藍牙名字,上課時學員們才不會連到別人的藍牙。

因此我的建議是,HC-05和HC-06價錢如果差不多的話,可以買HC-05有較多的AT指令設定,上課時學員既可以學習去查address指令,又可以不會搞混連線到別人的藍牙,重點是老師就不用在上課前花時間設定所有學員的藍牙名稱。

 

  1. 藍牙HC-05 USB轉TTL模組設定AT指令教學

如果沒有Arduino UNO板,則用USB 轉TTL模組也是可以設定AT指令,那麼要在哪裡設定AT指令呢?

其實只要能夠讀取COM Port,使用任何一種終端機軟體皆可,如Putty、RealTerm….等等,我是使用AI的 CH430G USB 轉TTL模組,和使用AccessPort這個終端機軟體。

USB 轉TTL模組

 

AcessPort終端機

在使用AcessPort終端機前,HC-05先與USB 轉TTL模組接線:

USB TO TTLHC-05
3.3VKEY(or En)
5VVCC
GNDGND
RXDTXD
TXDRXD

 

接線時要注意是和USB 轉TTL模組連接,USB 轉TTL模組TXD和HC-05的RXD互接;

USB 轉TTL模組RXD和HC-05的TXD互接。

 

再將USB 轉TTL模組插入電腦USB時,會自動安裝驅動程式:

驅動安裝好了之後,需來到裝置管理員查COM Port,這也是和藍牙溝通的COM Port,所以在AcessPort終端機要選同一個 COM Port。

打開AcessPort終端機後按齒輪圖示 ,設定好鮑率9600和COM Port:

再按下電源圖示 ,就可以設定HC-05 AT指令,AT指令請參考「1.分辨藍牙HC-05和Arduino UNO 板設定AT指令教學」。

並在下方發送區輸入AT指令後要先按下鍵盤Enter後再按下「發送數據」即可,以下方圖示表示:

5.藍牙HC-06 USB轉TTL模組設定AT指令教學

USB 轉TTL模組和HC-06接線圖:

要注意的一點是,USB 轉TTL模組的TX要接HC-06的RX;USB 轉TTL模組的RX要接HC-06的TX。

USB TO TTLHC-06
5.0VVCC
GNDGND
RXDTXD
TXDRXD

 

AT指令和前面一致,請參考「2.分辨藍牙HC-06和用Arduino UNO 板設定AT指令教學」

並在下方發送區輸入AT指令後按下「發送數據」即可,以下方圖示表示:

 

相關文章:

 

App Inventor IoT 新元件 – Arduino 101 與 BBC Microbit

App Inventor 新元件測試版釋出!看來BLE是大勢所趨,並新增了兩個主要的平台:Arduino 101 與 BBC Microbit不用再透過BLE元件去收發 integer, char 這麼底層的指令,直接有對應的感測器元件可以使用,上課更方便啦!

本文將以介紹App Inventor 結合 Arduino 101 為主,請參考MIT目前提供的植物監控App教學請由以下載點來匯入各個 aix 檔:

BLE藍牙元件 aix 載點

Arduino 101元件 aix載點

BBC® Micro:bit元件 aix載點

請由App Inventor 主站建立一個新專案,並由 Designer 頁面左下方的 Extension -> Import extension 來匯入上述的 aix 即可使用。我們會依序寫完各個範例,敬請期待喔~

Arduino 101 元件 (MIT說明),Grove 是指 Seeed Studio 的 Grove 套件

  • 加速度計(本身)
  • 按鈕
  • 陀螺儀(本身)
  • 溫濕度(Grove)
  • LED(可指定腳位)
  • 光感測器(Grove)
  • 土壤濕度(Grove)
  • PWM馬達控制
  • 腳位控制
  • 接近度感測器(Grove)
  • RGB LCD(Grove)
  • Servo(一般servo)
  • 錄音機(Grove)

Continue reading

[App Inventor] 比特幣價格顯示器

本文要介紹如何使用 App Inventor 的 Web 元件來取得網路上的比特幣價格走勢,並以 Google Chart折線圖來呈現。相關的應用我們已經寫過很多種,藉此您可知道 json 格式算是相當普遍的應用。

作者/攝影  曾吉弘
時間  3小時
成本 0
難度  * * *
材料表
  • 個人電腦Android手機 (也可用電腦端的 Android模擬器)

比特幣這款虛擬貨幣誕生於2009年,從一開始就受到矚目,價格也節節攀升。世界上許多企業與人們開始接受比特幣作為付款方式之一。有些實體店家也收/販售比特幣,例如台灣全家超商。當然,比特幣也可以匯兌方式交易,因此有以美金與其他主要貨幣計價的價格。2017年2月份查詢結果為1:1031。

 

線上比特幣服務

開始寫程式之前,我們得先知道如何取得比特幣的目前價格 (美金為單位)。

在網路上提供比特幣的目前價格或是歷史價格走勢的網站很多,例如Coindesk:

http://www.coindesk.com/price/

您可以在網站上取得比特幣的目前價格,還有相當漂亮的圖表來顯示比特幣的歷史價格走勢:

 

但這只能在網站上操作,我們需要一個介面或格式讓App Inventor可以擷取。因此在此我們採用另一個 coindesk 所提供的 API,這樣就能透過App Inventor的Web元件來處理它了:

http://api.coindesk.com/v1/bpi/currentprice.json

您可以直接從網路瀏覽器開啟,可看到這樣的文字網頁,只是格式是我們喜歡的json:

或是可用 JSONEditorOnline 這類型的網頁幫助您了解這份 json 的架構:

App Inventor程式說明

本範例所使用的元件不多,Button用來觸發網路爬資料等作業、Web元件負責擷取並解析json格式資料後轉成list。Clock元件是用來控制每20秒要求Web元件去取得資料,累積到10筆資料的話就要求WebViewer元件以Google Chart 折線圖的方式來呈現比特幣價格走勢。

 

Designer頁面

請依照下圖來完成本範例的元件配置,不需要一模一樣,差不多就可以了。

請記得把 Web (不是 WebViewer喔!) 元件的 Url 欄位填入資料來源:”http://api.coindesk.com/v1/bpi/currentprice.json

 

Blocks頁面

STEP1 按鈕啟動Clock取得最新價格的json資料

按下 Button_update 會把相關的變數、list 清空,並啟動 Clock.Timer 來更新資料。

STEP2   每20秒取得一次資料

Clock.Timer每20秒會啟動一次(TimerInterval = 20000),首先呼叫 web.get 方法去取得網頁內容。接著檢查 temp list 的長叫度,如果 >= 10 (這是我們自行決定的資料長度,您可以自行修改) 就呼叫 updateGraph 更新畫面並關閉 Clock.Timer。反之如果筆數不到10,則把 parseJson (就是該次呼的比特幣美金計價資料) 丟到 temp list 中。

STEP3 取得資料後進行解析

Web.GotText事件會在取得資料後自動啟動,在此我們把取得的網頁資料(純文字網頁,只是格式剛好是 json,因此您也可以這樣建立網頁,超簡單) 使用 Web.JsonTextDecode指令轉成 list 之後放入 json 變數中,並設定為 ListPicker 的內容。

STEP4 parseJson 副程式

這就是圖形化介面比較麻煩的地方了,為了取得比特幣的美金價格,要使用 select list item指令依序拆解,因此為了不要讓畫面被這一堆指令塞滿,還是用副程式包起來比較好。

STEP5 updateGraph 副程式

本副程式中,首先使用 for 迴圈重複10來組合每次取得的比特幣價格,搭配”,”分隔之後再組合下一筆價格。

最後呼叫 WebViewer 開啟 Google Chart API 網頁即可看到走勢折線圖。由於我們只需要修改 chd=t: 後面的資料內容,所以前面的網址都以字串方式寫在程式當中。相關Google Chart API 請參閱官方網站

操作

安裝好程式之後請點選[Update bitcoin price]按鈕,就會在狀態列看到目前已取得的資料筆數,一旦累積到10筆資料就可以看到折線圖了。比特幣一直在漲啊…

如果不耐煩的話,您可以把Clock.Timer的 TimerInterval改快一點,例如1000代表每秒更新一次,但這樣一來由於時間太密集,比特幣價格變化不會太大(當然還是有可能暴漲暴跌),所呈現的走勢圖應該就會是一條直線了。

 

相關文章:

[課程紀錄]Arduino+手機App 物聯網應用實作:打造環境感測裝置@T客邦

作者/攝影 曾吉弘
課程時間  2017 2/11
課程講師 曾吉弘、薛皓云
課程場地  T客邦創客基地

2/11 星期六寒風颼颼呢,但在T客邦創客基地有20位學員一起來打基礎,Arduino 與 Android 的藍牙通訊。現場學員來自各方,有來自基隆的國小老師,也有電子公司工程師,也有純粹想學的朋友們。

同學們的問題相當五花八門,差點就被問倒了,但這正是教學相長的開始,您說是嗎?

本日課程主軸是告訴您Arduino(介面與網路功能較缺乏) 與 Android 手機(採用App Inventor 編寫程式)兩者結合之後有哪些有趣的應用

  • 手機可以做為顯示器來呈現Arduino丟過來的感測器資料(手機應該沒辦法讓您直接接感測器或LED吧,但您想的到的基礎電子元件,Arduino幾乎都可以存取)
  • 或是控制器根據某些條件(簡訊、Email、或是opendata 查詢結果) 來觸發Arduino 執行某些動作。

兩天課表的 Google doc 在這邊,請和我們一起學習吧,您可以根據文末的投影片或到CAVEDU技術部落格查詢[雙A],會有相當豐富的資料。

自誇一下,[Arduino從入門到雲端]這本書現場詢問度很高喔

 

以下是上課照片

上課時我都會用123D Circuit來介紹,除了可以用投影機以外(大家想想看要學生走過來走過去看麵包板的接線…),還可以模擬,接錯線不小心燒掉元件的機會可以降低一點。我在很多學校都直接要求用這個交作業呢。

當天助教(其實我們的助教都是講師)薛老師,本著對於初音的熱愛開始玩Arduino、Unity等許多奇奇怪怪的應用。有什麼冷門的疑難雜症問他就對了~

通訊之夜投影片:


 

相關文章:

[101專題計畫分享] Arduino101(Genuino 101)&App Inventor – RGB LED控制

本文延伸自 App Inventor 中文學習網的[取得像素顏色]範例,將觸碰點的RGB值經由藍牙丟給Arduino 101 去點亮 RGB 燈,您可以擴充多顆RGB LED或其他彩色模組來達到更有趣的效果,可以說是極簡易版的 Philip HUE 照明系統喔!

本範例使用 Arduino 101,如果您是使用HC05 06 這類型的藍牙模組,則需使用 App Inventor 的 BluetoothClient元件,兩者不可混用。

程式碼請由此下載

 

作者/攝影  曾吉弘
時間  3~4小時
成本
  • Arduino 101 $1575 (購買連結)
  • RGB LED模組(本範例使用共陰) $30~50
  • 跳線  (一綑單芯線,$100左右,也可以買公公/公母杜邦線)
  • 400孔麵包板 ($80~100)
難度  * * * * *
材料表
  • 個人電腦 (作業系統可用 Windows, Mac OSX 與 Linux,本範例使用 Windows 7)
  • Arduino 101開發板
  • RGB LED模組(本範例使用共陰)

本文將介紹如何取得觸碰點的 RGB 參數之後透過 BLE 送給 Arduino 101 來點亮 RGB LED。

先來看影片吧

App Inventor

Designer

  • 使用 Canvas 來取得觸碰點座標。
  • 兩個連線斷線用的按鈕:Btn_Connect /  Btn_DisConnect
  • 三個用來呈現RGB值的 Slider (無法拖動)
  • BletoothLE:處理BLE通訊
  • Clock:定期要求 BluetoothLE 將資料(RGB參數)發送給 Arduino 101

Blocks

1.初始化

宣告相關變數,其中addr 代表您所要連線之Arduino 101 藍牙位址,印在板子背面。程式初始化時,要求BluetoothLE元件開始掃瞄。

2.連線與斷線

按下連線按鈕,BluetoothLE元件對指定位址裝置(Arduino 101)連線,並設定相關畫面元件是否可操作,並顯示”Connected”於螢幕狀態列。

斷線則剛好相反,斷開與Arduino 101之BLE連線之後將相關畫面元件恢復原狀,這樣才能重新操作。

 

3.滑動手指取得觸碰點RGB參數

使用 Ball.Dragged 事件,當拖動這個小球(代表您手指的位置)時,會執行以下動作:

  1. 清除畫面
  2. 將該觸碰點的GetPixelColor結果顯示在Canvas上,會是一個相當大的負整數後續使用select list item 去解出來之後就會是 0~255 的整數了。
  3. Ball 移動到觸碰點位置
  4. 使用select list item 搭配 split 指令去分別取得該點的紅色、綠色與藍色值,顯示於Label上即可。

接著在 Ball.Dragged 事件的下半,分別更新每一個 Slider 的指針位置(ThumbPosition)以及更新 r g b 三個變數的內容為該觸碰點的 r g b 顏色強度,準備要發送出去囉!
如果您覺得這裡的程式碼相當冗長的話,可以用一個副程式包起來讓主程式流程更簡潔易讀。

4.發送訊號

使用 Clock 元件每1秒鐘觸發一次 Clock.Timer事件,其中會使用 BluetoothLE.WriteIntValue 將 r g b 值的組合結果發送出去,例如 (128, 34, 255) 的組合結果就是 128034255,Arduino 收到之後再拆解即可。
Clock.Timer 事件的1秒鐘您可以自行修改為較小的數字,看看是否有比較好的操作體驗。

 

Arduino 101 code

重點在於 line 53~67 之間的if (LEDStatus.written())判斷式中,使用 incom = LEDStatus.value(); 來取得 App Inventor 送過來的整數值,並以 1000 為單位來拆開並顯示於 Serial Monitor,最後使用 analogWrite 指令去控制對應的 RGB LED 腳位就完成囉!

#include <CurieBLE.h>
#include <stdlib.h>
#define LEDr 6
#define LEDg 5
#define LEDb 3

BLEPeripheral blePeripheral;  // BLE Peripheral Device (the board you're programming)
BLEService ControlLED("19B10010-E8F2-537E-4F6C-D104768A1214"); // BLE AnalogRead Service

// BLE LED Switch Characteristic - custom 128-bit UUID, read and writable by central
BLEUnsignedIntCharacteristic LEDStatus("19B10011-E8F2-537E-4F6C-D104768A1214", BLERead | BLEWrite  );

int incom = 0;
int r, g, b ;

void setup() {
  Serial.begin(9600);
  // set Light pin to output mode
  // set advertised local name and service UUID:
  blePeripheral.setLocalName("ControlLED");
  blePeripheral.setAdvertisedServiceUuid(ControlLED.uuid());

  // add service and characteristic:
  blePeripheral.addAttribute(ControlLED);
  blePeripheral.addAttribute(LEDStatus);

  // begin advertising BLE Light service:
  blePeripheral.begin();

  Serial.println("BLE RGBLED control.");

  pinMode(LEDr, OUTPUT);
  pinMode(LEDg, OUTPUT);
  pinMode(LEDb, OUTPUT);

}

void loop() {
  // listen for BLE peripherals to connect:

  BLECentral central = blePeripheral.central();
  // if a central is connected to peripheral:
  if (central) {
    Serial.print("Connected to central: ");
    // print the central's MAC address:
    Serial.println(central.address());


    // while the central is still connected to peripheral:
    while (central.connected()) {
      //Serial.println(LEDStatus.written());
      if (LEDStatus.written())
      {
        incom = LEDStatus.value();//110225101
        r = incom / 1000000 ;//110
        g = (incom / 1000 - r * 1000) ; //110225-110000=225
        b = (incom - r * 1000000 - g * 1000) ; //110225101-110000000-2250000=101
        Serial.println(incom);
        Serial.println(r);
        Serial.println(g);
        Serial.println(b);
        analogWrite(LEDr, r);
        analogWrite(LEDg, g);
        analogWrite(LEDb, b);
        delay(10);
      }
    }
    digitalWrite(LEDr, LOW);
    digitalWrite(LEDg, LOW);
    digitalWrite(LEDb, LOW);
    delay(100);
  }

  // when the central disconnects, print it out:

  Serial.print(F("Disconnected from central: "));
  Serial.println(central.address());
}

 

相關文章:

[App Inventor] LASS 測站資料查詢

LASS(Location Aware Sensing System)是一套開源和公益的「環境感測器網路系統」,是一群熱情的朋友針對空氣污染所建置的系統。由於空氣品質是小範圍的變化,例如校園內與十字路口可能只差50公尺,但空氣品質應該差很多吧!LASS就是讓有意願盡一份力的朋友,都能將感測器的資訊丟上LASS server,完全是 bottom-up 的概念,在一年多的時間之內就已經是相當知名的專案了。

LASS 針對許多物聯網開發板(Arduino、Raspberry Pi、LinkIt ONE、Realtek Ameba等等)都有現成的程式碼可以套用,裝置上線之後就能在LASS空汙地圖 看到各個測站的狀態。也可以購買套件包喔!

本文將說明如何使用 App Inventor 取得 LASS 各測站的資料,格式為JSON,網址為http://nrl.iis.sinica.edu.tw/LASS/last-all-airbox.json

Continue reading

[App Inventor教學] 上傳照片到微軟認知服務Computer Vision API,使用 Makeblock CamVision

本範例可將所拍攝的照片上傳到微軟認知服務Computer Vision API,經辨識之後可取得以下資料:

  • 照片說明(text)
  • 前景主色(text)
  • 背景主色(text)
  • 相片標籤(list)

使用 Makeblock 所開發的 CamVision extension 檔,另外也有控制其 mBot 機器人平台的 extension,我們也在測試中喔

注意:

  1. 經實測只能使用在 MIT 所提供之測試伺服器,正式伺服器匯入時會有問題
  2. 點選 Prepare 按鍵時,會把相機開起來(這時並沒有跳到拍攝預覽畫面,但的確已經開啟),因此其他會用到相機的程式,例如條碼掃描程式(下載 apk 用) 會無法使用。請先關閉本程式再使用其他相機程式。

 aia 與 apk 下載請點我(App Inventor中文學習網)

使用的照片:

img20160917130103

辨識結果如下圖:

  • 照片說明(a cat laying on a bed)
  • 前景主色(灰色)
  • 背景主色(灰色)
  • 相片標籤(indoor, cat, wall, laying)
screenshot_2016-09-17-13-47-41-29

Continue reading