หลังจาก Blynk (legacy) ปิดตัวไปเมื่อไม่นานมานี้ และทางผู้พัฒนา Blynk แนะนำให้เปลี่ยนเป็นเวอร์ชั่นใหม่ (2.0) ในบทความนี้จึงจะมาแนะนำและลองเล่น Blynk 2.0 โดยใช้บอร์ด KidBright ที่ภายในใช้ ESP32 ในการทดลองส่ง-รับข้อมูลผมแสดงผลบนแอพฯ และเว็บ โดยทดลองทั้งการสั่งงานขาต่าง ๆ และใช้ Virtual Pin ส่งค่าอุณหภูมิขึ้นมาแสดงผล ใช้ Platform IO ในการพัฒนาโปรแกรม
โครงสร้างบอร์ด KidBright
บอร์ด KidBright เป็นบอร์ด ESP32 ที่มีเซ็นเซอร์ อุปกรณ์รับค่า และอุปกรณ์แสดงผล หลาย ๆ ตัวอยู่บนบอร์ด ทำให้สะดวกต่อการทดลอง โดยในบทความนี้เลือกใช้หลอดแอลดีอี WiFi และ IOT มาทดลองควบคุมเปิด-ปิด และใช้เซ็นเซอร์วัดอุณหภูมิ LM73 โครงสร้างและการต่อขากับ ESP32 (Internal Wiring) แสดงดังรูปที่ 1
ตำแหน่งขาของอุปกรณ์ที่ใช้ทดลอง มีดังนี้
WiFi LED -> IO2
IOT LED -> IO12
LM73 -> SDA: 4, SCL: 5
ตำแหน่งขาเหล่านี้จะถูกนำไปใช้ตั้งค่าในเว็บ Blynk และเขียนโปรแกรมใน Platform IO ต่อไป
การใช้งาน Blynk 2.0 บนเว็บ
Blynk (legacy) การใช้งานทั้งหมดสามารถทำได้บนแอพฯ ในโทรศัพท์มือถอืได้เลย แต่สำหรับ New Blynk / Blynk 2.0 แนะนำให้สร้าง Templates และเพิ่มอุปกรณ์ในเว็บก่อน โดยมีขั้นตอนดังนี้
1) เข้าไปที่ https://blynk.cloud/ จากนั้นสมัครสมาชิก-เข้าสู่ระบบให้เรียบร้อย จากนั้นกดเมนู Templates แล้วกด New Tamplate
2) ใส่รายละเอียดของ Template โดยใส่ชื่อ Template เลือก Hardware และเลือก Connection Type แล้วกด Done
3) กำหนดขาที่ใช้งาน และช่องทางการรับส่งข้อมูล โดยกดที่ Datastreams แล้วกดปุ่ม New Datastreams
4) Datastreams ต้องสร้าง 3 ช่อง โดยแบ่งดังนี้
Digital, Pin 2, Output สำหรับใช้ควบคุม WiFI LED
Digital, Pin 12, Output สำหรับใช้ควบคุม IOT LED
Virtual Pin, Pin V0 สำหรับใช้แสดงค่าอุณหภูมิ
Datastreams อันแรก WiFi LED กดเลือก Digital
5) ใส่ชื่อตรง Name เป็น WiFi_LED เลือก Pin เป็น 2 เลือก Pin Mode เป็น 3 แล้วกด Create
6) จะมี WiFi_LED ขึ้นมา ยังขาด IOT_LED และ V0 ที่ใช้แสดงค่าอุณหภูมิ กด New Datastream เพื่อสร้าง IOT_LED ตามขั้นตอน 4 ถึง 6 อีกครั้ง
7) สร้าง Virtual Pin, Pin V0 สำหรับใช้แสดงค่าอุณหภูมิ กด New Datastream เลือก Virtual Pin
8) ตั้งค่าดังนี้
ตั้งชื่อ
เลือก Virtual Pin เป็น V0
Data Type มี int, double และ String สำหรับอุณหภูมิเป็นค่าทศนิยม จึงเลือกเป็น Double
Units เลือก Celsius
Max กำหนดค่าสูงสุดที่เป็นไปได้ แนะนำให้ใส่ 100
Decimals กำหนดทศนิยม แนะนำให้เลือก #.# คือทศนิยม 1 ตำแหน่ง
แล้วกดปุ่ม Create
9) ได้ Datastreams มา 3 ชุด ตามรูป
10) สร้าง Dashboard บนเว็บ โดยกดไปที่เมนู Web Dashboard ด้านขวามี Widget ให้เลือก คลิกค้างที่ Switch แล้วลากมาใส่พื้นที่ทำงานด้านขวา แล้วกดรูปเฟืองเพื่อแก้ไขข้อมูล
11) แก้ไขข้อมูลของ Widget Switch ดังนี้
ตั้งชื่อของสวิตช์ เนื่องจากสวิตช์นี้ใช้ควบคุม WiFi LED จึงตั้งเป็น WiFi LED
Datastream เลือก WiFi_LED
ON Value ใส่ 0
OFF Value ใส่ 1
กดปุ่ม Save
สำหรับหลอด LED บนบอร์ด KidBright เป็นแบบ Active LOW ดังนั้น 0 คือไฟติด, 1 คือไฟดับ จึงกำหนดให้ ON=0, OFF=1
12) เพิ่ม Widget Switch อีก 1 ชุด แล้วตั้งค่าสำหรับ IOT LED
13) เพิ่ม Widget Label สำหรับแสดงผลค่าอุณหภูมิ
14) ตั้งค่า Widget Label สำหรับแสดงผลค่าอุณหภูมิ ดังรูป
15) กดปุ่ม Save เพื่อบันทึก Template
16) เพิ่มอุปกรณ์ใหม่ กดเมนูรูปแว่นด้านซ้าย แล้วกดปุ่ม New Device
17) กดสร้างอุปกรณ์ใหม่จาก template
18) เลือก Template เป็น Template ที่สร้างไว้ ตั้งชื่อ Device Name ที่ต้องการสร้าง แล้วกด Create
19) เมื่อสร้าง Device Info เรียบร้อยแล้ว กดตรง Device Info ตรง FIRMWARE CONFIGURATION จะต้องนำไปใส่ในโค้ดในขั้นตอนต่อไป
อัพโหลดโปรแกรม
รู้จักและใช้งาน PlatformIO เบื้องต้น จากนั้นดำเนินการดังนี้
1) ดาวน์โหลดโค้ดโปรแกรมตัวอย่างจาก https://github.com/maxpromer/NewBlynkTest โดยกด Code > Download Zip
2) รอจนกว่าจะดาวน์โหลดเสร็จ แล้วแตกไฟล์ออกมา
3) เปิดโปรแกรม VS Code ที่ติดตั้ง Platform IO เปิดโปรเจคขึ้นมาโดยกด File > Open Folder...
4) เข้าไปในโฟลเดอร์ตามข้อ 2 แล้วกด Select Folder
5) เปิดไฟล์ main.cpp แล้วคัดลอก FIRMWARE CONFIGURATION ไปทับในบรรทัด 36 ถึง 38 จากนั้นแก้ชื่อ WiFi และรหัสผ่าน ในบรรทัดที่ 50 - 51
6) อัพโหลดโปรแกรม จากนั้นเปิด Serial Monitor ขึ้นมา หากแก้ไขข้อมูลถูกต้อง จะแสดง Ready ดังรูป
ทดลองสั่งงานจากบนเว็บ
ที่หน้าเว็บ หากอุปกรณ์สามารถเชื่อมต่อได้ สถานะอุปกรณ์บนเว็บจะขึ้นเป็น Online เมื่อทดลองกดปุ่ม WiFi LED จะสังเกตเห็นว่าสามารถควบคุมหลอดแอลอีดี WiFi ได้แล้ว หากกดปุ่ม IOT LED จะควบคุมเปิด-ปิดแอลอีดี IOT ได้ และมีค่าอุณหภูมิแสดงในช่อง Temperature อัพเดทค่าทุก ๆ 1 วินาที
การสั่งงานผ่านแอพฯ
การสั่งงานผ่านแอพฯ สามารถทำได้ผ่านแอพฯ Blynk IoT โดยติดตั้งได้จาก Google Play
หลังจากติดตั้ง จำเป็นต้องสร้างหน้า Dashboard บนแอพฯก่อน ตามขั้นตอนดังนี้
1) เปิด Blynk IoT เข้าสู่ระบบให้เรียบ จากนั้นกด ไอค่อนมุมขวาบน
2) กด Developer Mode
3) กดเลือก Template ที่สร้างไว้บนเว็บจากขั้นตอนก่อนหน้านี้
4) ระบบจะพามาหน้าจัดการ Dashboard กดเครื่องหมายบวกเพื่อเพิ่ม Widget
5) เพิ่มปุ่มควบคุม WiFi LED กดเลือก Button
6) กดที่รูป Button เพื่อตั้งค่า
7) ตั้งค่า Button ที่ใช้ควบคุม WiFi LED ดังนี้
ตั้งชื่อ Widget
DATASTREAM กำหนดเป็น WiFi_LED
OVERRIDE HIGH/LOW เลือกเป็น ON
VALUE กำหนดเป็น 1 และ 0 ตามลำดับ
MODE เลือกเป็น SWITCH
ON/OFF LABELS
เสร็จแล้วกดปุ่มย้อนกลับ
8) จะได้ปุ่มควบคุม WiFi LED แล้ว ทำตามขั้นตอน 6 - 8 อีกครั้งเพื่อเพิ่มปุ่ม IOT LED
9) เพิ่ม Widget: Value Display เพื่อใช้แสดงผลอุณหภูมิ
10) กดที่ Widget ใหม่ เพื่อตั้งค่า
11) ตั้งค่า Widget ใหม่ ดังนี้
Name ใส่ชื่อของ Widget นี้ ตัวอย่างใช้แสดงค่าอุณหภูมิ จึงใส่ Temperature
DATASTREAM กำหนดเป็น Temp
12) เพิ่ม Widget ครบ (ดังรูป) ให้กดปุ่มย้อนกลับ
12) กดปุ่มปิดหน้าต่าง Developer Mode
13) ได้หน้า Dashboard ที่สมบูรณ์
ทดลองสั่งงานจากแอพฯ
เมื่อทดลองกดปุ่ม WiFi LED จะเห็นว่าสามารถควบคุมหลอดแอลอีดี WiFi ได้ หากกดปุ่ม IOT LED จะควบคุมเปิด-ปิดแอลอีดี IOT ได้ และมีค่าอุณหภูมิแสดงในช่อง Temperature อัพเดทค่าทุก ๆ 1 วินาที
Comments