條碼/二維碼 報到/打卡/登錄系統實作 mBlock5+BrainGO+QRcodeScanner+ESP8266+GoogleSheet

本系統主要分為三個部分:
第一:建立IFTTT及GoogleSheet。
第二:條碼/二維碼掃碼後,利用IFTTT將卡片資料登錄至GoogleSheet中。
第三:以mBlock5積木程式去讀取GoogleSheet中已登錄之資料,進行資料分析、畫面呈現及語音播報。

第一:建立 IFTTT及 GoogleSheet。

  1. 請參考站內文章 建立IFTTT程序:如果收到網址要求,則將資料寫入Google試算表
  2. 打開試算表,清空第二列以後的資料,僅留下第一列,並在試算表的 I1 欄位,輸入 =COUNTA(A1:A2)
  3. 以瀏覽器送出網址要求https://maker.ifttt.com/trigger/googlesheet2/with/key/dGxxxxxxxx_g4?value1=1&value2=2,測試是否會新增一列,且I1欄位顯示為2。

第二:條碼/二維碼掃碼後,利用 IFTTT將卡片資料登錄至 GoogleSheet中。

一、硬體線路

BrainGO(Arduino) D3 <-> UTXD ESP8266(ESP-12)
BrainGO(Arduino) D2 <-> URXD ESP8266(ESP-12)
BrainGO(Arduino) V+ <-> VIN ESP8266(ESP-12)
BrainGO(Arduino) GND <-> GND ESP8266(ESP-12)

BrainGO(Arduino) Rx <-> Tx QR Code Scanner
BrainGO(Arduino) Tx <-> Rx QR Code Scanner
BrainGO(Arduino) V+ <-> V+ QR Code Scanner
BrainGO(Arduino) GND <-> GND QR Code Scanner

※請勿必確定ESP8266或其它wifi模組處於可接受AT命令的模式,才能接受BrainGO指令連線wifi。

二、mBlock5積木程式

1.開啟mBlock5

2.加入延伸集

物聯網nodemcu、Bar/QR code scanner、URL encode decode

3.積木程式

請修改wifi積木中的SSIDwifi密碼、你的wifi模組鮑率事件名稱IFTTT公鑰,本例中的我使用的ESP8266鮑率為115200,ESP8266的Tx接至BrainGO的D3、ESP8266的Rx接至BrainGO的D2,事件名稱為googlesheet2。

4.上傳並測試

上傳後,使用Bar/QR code掃描器去掃條碼或二維碼,再去檢查一下是否讀入的資料有被紀錄到google試算表內。傳送時間,約需5秒。

※若測試沒有問題,則BrainGO只要有供電就可以運作了,無需再連接電腦的USB了。

第三:以mBlock5積木程式去讀取GoogleSheet中已登錄之資料,進行資料分析、呈現及語音播報。

一、修改Google試算表

1.設定共用 – 知道連結的使用者 – 編輯者 – 複製連結

2.將共用連結貼到下列的程式積木中

二、mBlock5積木程式

1.積木圖片

2.積木程式

3.修改連接到共用工作表積木

如果貼上的期用連結沒問題的話,按下綠旗執行,就會看到「己連結到Google工作表」的連結成功提示,如下圖。

4.修改變數清單中「編號」及「姓名」的內容,編號應和條碼內容一致,姓名可依實際匯入,登錄時間不用理會。

附錄:

[ 實用] QRExplore,快速生成QRCode 的網 … – 無聊詹軟體資訊站

Brain GO + mBlock5 程式設計 – LED呼吸燈

LED呼吸燈 – 綠燈呼吸練習

  1. 沒有呼吸燈積木?
    1. 還好有PWM積木
    2. 可是它不是讓我們選 紅燈、綠燈or黃燈耶!怎麼辦?
    3. 如上圖可以看出綠燈是接在數位腳位10,先筆記一下!(紅色D9/綠色D10/黃色D11)
  2.  積木程式設計
    1. 拖曳積木區 事件/當BrainGO啟動 到程式區
    2. 初始化亮度
      1. 變數/建立變數 -> 輸入[亮度]
      2. 變數/變數[亮度]設為[0] -> 改成[255] (※注意255最暗!!!)
    3. 引腳/設置PWM[9]輸出為[0] -> 拖曳 變數[亮度]到[0]的位置,關閉紅燈
    4. 引腳/設置PWM[10]輸出為[亮度] -> 關閉綠燈
    5. 引腳/設置PWM[11]輸出為[亮度] -> 關閉黃燈
    6. 控制/不停重覆
    7. 控制/重覆[10]次 ->改為20
    8. 引腳/設置PWM[10]輸出為[亮度]
    9. 變數/變數[亮度]改變[0] -> -2
    10. 控制/等待1秒 -> 改為0.1
    11. 控制/重覆[10]次 ->改為20
    12. 變數/變數[亮度]改變[0] -> 2
    13. 引腳/設置PWM[10]輸出為[亮度]
    14. 控制/等待1秒 -> 改為0.1
    15. 如下圖
  3. 硬體連接 – 使用USB線將BrainGO和電腦連接(如果不會,請補課!)
  4. 連線與上傳執行(如果不會,請補課!)
    1. 上傳完成後,BrainGO主板就自動啟動執行程式了喔!
      >>> 哈囉!影片在這兒! LED呼吸燈 <<<

mBlock5範例程式-LED呼吸燈範例程式

或許你會需要補課:
Brain GO + mBlock5 程式設計 – 程式下載與安裝
Brain GO + mBlock5 程式設計 – 第一個程式 – LED燈控制 – 積木程式設計與上傳執行

 

Brain GO + mBlock5 程式設計 – 第一個程式 – LED燈控制 – 積木程式設計與上傳執行

第一個程式 – LED燈控制 – 紅燈一閃一閃亮晶晶

  1.  積木程式設計

    1. 拖曳積木區 事件/當BrainGO啟動 到程式區
    2. 控制/不停重覆
    3. 引腳/設置紅色LED為亮
    4. 控制/等待1秒 -> 改為0.5
    5. 引腳/設置紅色LED為亮 -> 改為關
    6. 控制/等待1秒 -> 改為0.5
    7. 如下圖
  2. 硬體連接 – 使用USB線將BrainGO和電腦連接

  3. 連線與上傳執行

    1. 開啟BrainGO主板的電源。
    2. 點按 連接/ 勾選 v顯示所有可連接的設備。
    3. 選擇連接埠,本例為COM3,你的可能不一樣喔!(有的電腦要等久一點才會有連接埠出現)
    4. 點按 連接 按鈕。
    5. 看到上傳按鈕就完成連線了。
    6. 按下 上傳按鈕,等待上傳進度,完成上傳。
    7. 上傳完成後,BrainGO主板就自動啟動執行程式了喔!
      >>> 哈囉!影片在這兒! LED閃爍 <<<

或許你會需要補課:

Brain GO + mBlock5 程式設計 – 程式下載與安裝

繼續閱讀:

Brain GO + mBlock5 程式設計 – LED呼吸燈

Follow by Email