03Blynk+WeMos D1

(2017/01/30 大年初三)

前陣子發現有一Blynk可控制Arduino的手機APP程式,前一個作品是Arduino利用USB線來上網,春節放假這幾天則改利用ESP-01來上網,但一直都沒有成功,也不知問題出在哪?沒辦法只好再玩其他的,這次是利用很像Arduino板子的WeMos D1 R2,玩起來似乎就順利了很多~~

題目一:利用Blynk APP來控制WeMos上的三色燈

參考資料:Control an arduino project through a customisable android / Iphone app with Blynk and Wemos D1: THE 2016 SUPER NOOB FRIENDLY WAY

一、WeMos 在Arduino的安裝說明

二、Blynk 在Arduino下的函數庫

1. download the latest blynk library from http://www.blynk.cc/getting-started/ , unzip and copy it to your arduino library directory (usually: C:\Program Files (x86)\Arduino\libraries).

2. Download blynk app for android or iphone ( it's in the apple / google play store for free) and make your first app. go to settings and chose esp8266.

3. under "settings" in the app you will find "auth token" email this to yourself, you will need it later (see image above)

4. open arduino IDE

5. under file, examples, choose blynk, "esp8266 standalone"

6. in the sketch, add the auth token from step 3 where it says auth token. SSID is geek language for the name of your wifi connection and password is the password to your wifi network. Fill these three in in the sketch in their respective places (see picture). There is no need to further edit the sketch. Just with this code you will have full control over all your board's pins through the app.Take my word for it, it will be great!

註:設定好Blynk專案名稱後,Blynk會將認證碼寄到MAIL信箱

點選序列埠監控視窗

三、開啟手機中的Blynk程式

  • 先認識WeMos腳位與Arduino腳位的關係

    • 建立一個新專案,設備要選擇ESP8266

      • 新增一個slider元件

      • PIN腳選gp14(相當於arduino的D13腳位)

      • 修改名稱

      • 一共有三顆燈,畫面如下!測試紅燈

      • 測試綠燈

      • 測試藍燈

    • 題目一測試成功

    • (補充) 可再加一個按鈕控制ESP8266旁的LED燈(GPIO2)

題目二:利用Blynk APP來控制WeMos上的YWRobot的擴充板上的元件

  • 先認識WeMos腳位與Arduino腳位的關係

  • YWRoBo擴充板上的腳位

    • YWRoBot的D2 按鍵 (GPIO16)

    • YWRoBot的D3 按鍵 (GPIO05)

    • YWRoBot的D4 DHT11溫濕度 (GPIO04) (在Blynk下,不知如何使用)

    • YWRoBot的D5 蜂鳴器 (GPIO0)

    • YWRoBot的D6 紅外線接收器 (GPIO02) (在Blynk下,不知如何使用)

    • YWRoBot的D7 未使用(GPIO14)

    • YWRoBot的D8 未使用(GPIO12)

    • YWRoBot的D9 RGB LED之紅燈 (GPIO13)

    • YWRoBot的D10 RGB LED之綠燈 (GPIO15)

    • YWRoBot的D11 RGB LED之藍燈 (GPIO13)

    • YWRoBot的D12 LED紅燈 (GPIO12)

    • YWRoBot的D13 LED藍燈 (GPIO14)

    • YWRoBot的A0電位器 (GPIO12)

    • 很奇怪D9與D11是接到GPIO13

  • 進入Blynk寫APP

  • 建立一個新專案,設備要選擇ESP8266

    • 參考前一篇文章的內容,將此APP完成如下

    • 測試結果,如下:

題目三:利用Blynk APP來顯示DHT11的溫濕度(感謝 蔡亞柏老師指導)

  • 說明:在題目二中有關DHT11(D4)的元件,不知該如何取得其值,並轉換成溫濕度值,感謝蔡亞柏老師提供程式來執行

  • Arduino程式:

    • 記得要將下面程式的 your project auth code改成自己的認證碼

      • 將Blynk.begin(auth, "your ssid",”your password"); 改成自己WIFI的名稱及密碼

    • 完整程式

    • #define BLYNK_PRINT Serial // Comment this out to disable prints and save space

    • #include <ESP8266WiFi.h>

    • #include <BlynkSimpleEsp8266.h>

    • #include <DHT.h> //引用 https://github.com/adafruit/DHT-sensor-library

    • #define DHTTYPE DHT11

    • #define DHTPIN 4

    • DHT dht(DHTPIN, DHTTYPE, 30);

    • float humidity, temp_f; // Values read from sensor

    • // You should get Auth Token in the Blynk App.

    • // Go to the Project Settings (nut icon).

    • char auth[] = "your project auth code";

    • void setup()

    • {

    • Serial.begin(9600);

    • Blynk.begin(auth, "your ssid",”your password");

    • dht.begin(); // initialize temperature sensor

    • }

    • BLYNK_READ(1)

    • {

    • temp_f = dht.readTemperature(false);// Read temperature as Celsius

    • int value=temp_f*10;

    • String str;

    • char result[5];

    • result[0]=(value/100)+'0';

    • result[1]=((value/10)%10)+'0';

    • result[2]='.';

    • result[3]=(value%10)+'0';

    • result[4]='\0';

    • str +=result;

    • str +="℃";

    • //char buf[str.length()+1];

    • char buf[8];

    • str.toCharArray(buf,sizeof(buf));

    • Blynk.virtualWrite(1,buf);

    • }

    • BLYNK_READ(2)

    • {

    • humidity = dht.readHumidity(); // Read humidity (percent)

    • int value=humidity*10;

    • String str;

    • char result[5];

    • result[0]=(value/100)+'0';

    • result[1]=((value/10)%10)+'0';

    • result[2]='.';

    • result[3]=(value%10)+'0';

    • result[4]='\0';

    • str +=result;

    • str +="%";

    • //char buf[str.length()+1];

    • char buf[8];

    • str.toCharArray(buf,sizeof(buf));

    • Blynk.virtualWrite(2,buf);

    • }

    • void loop()

    • {

    • Blynk.run();

    • }

  • 燒錄上面程式到WeMos時,如果出現問題,要記得再去下載下面兩個程式

  • Blynk 的使用

    • 建立二個 Value Display 元件來顯示溫度及濕度值,並使用Virtual腳位 (原來是這樣使用)

    • 整體畫面,測試成功!!