> For the complete documentation index, see [llms.txt](https://docs.makerplayground.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.makerplayground.io/intro/iot/blynk/2.md).

# ตัวอย่าง 2 - ทดลองสร้างสวิทช์เปิดปิดและปรับความสว่างหลอดไฟผ่าน Blynk

ในการทดลองนี้ จะทำการสร้างสวิทช์เสมือนและแถบเลื่อนบน Blynk แอพพลิกเคชั่น เพื่อสั่งให้หลอดไฟที่อยู่บนอุปกรณ์ไมโครคอนโทรเลอร์ เปิด-ปิด และเปลี่ยนแปลงความสว่าง

อุปกรณ์ที่ใช้ในตัวอย่างนี้ประกอบด้วย

1. Maker Playground Baseboard
2. Maker Playground LED

### ภายในซอฟต์แวร์เมกเกอร์เพลย์กราวน์

1\. ภายใต้เมนู Device / Device Configuration ให้ทำการเลือก

* Platform : Arduino (Atmel AVR)
* Controller : Maker Playground Baseboard V3

{% hint style="info" %}
ผู้ใช้งานจำเป็นต้องแก้ไขตัวเลือกทั้ง Platform และ Controller ให้ตรงกับอุปกรณ์ที่ผู้ใช้งานกำลังพัฒนางานร่วมด้วย
{% endhint %}

![](/files/-LxWkEVKOdT4ULMdF_x1)

2\. ภายใต้เมนู Device / Device Explorer ให้ทำการค้นหา Maker Playground LED และกดปุ่ม + เพื่อเพิ่มอุปกรณ์ไปยังรายการที่จะนำมาใช้งาน

![](/files/-LxWkT5T8fHnSRscWT93)

3\. ค้นหาและเพิ่ม Blynk Virtual Button

![](/files/-LxWku0NvYfUu_3AT4KD)

4\. ค้นหาและเพิ่ม Blynk Virtual Slider

![](/files/-LxWl7ZOSoeAfXQIO9XN)

5\. เมื่อผู้ใช้งานเพิ่ม Maker Playground LED, Blynk Virtual Button และ Blynk Virtual Slider ภายใต้เมนู Device / Device Configuration จะมีรายการอุปกรณ์ LED1, VirtualButton1, VirtualSlider1 เพิ่มเข้ามา

![](/files/-LxWm8-WhKYXeYQwWtGt)

{% hint style="warning" %}
หากลองสังเกตุด้านข้างของแถบเมนู Device จากรูปภาพในข้อ 5 จะมีสัญลักษณ์เครื่องหมายตกใจสีเหลืองอยู่ด้านหน้า นั่นหมายถึงยังคงมีตัวเลือกที่ต้องการการตั้งค่าจากผู้ใช้ มิเช่นนั้น จะไม่สามารถอัพโหลดโปรแกรมไปยังบอร์ดไมโครคอนโทรเลอร์ได้
{% endhint %}

6\. ผู้ใช้ต้องเลือก Port ให้กับ Maker Playground LED, Blynk Virtual Button และ Blynk Virtual Slider ที่เพิ่มเข้ามาใหม่ เมื่อทำการเลือก Port ให้กับอุปกรณ์เรียบร้อยแล้ว หน้าต่างจำลองการเชื่อมต่อวงจรทางด้านขวาจะวาดภาพการเชื่อมต่อสายระหว่าง Controller และ Sensor โดยอัติโนมัติ

{% hint style="warning" %}
โปรดตรวจสอบ virtual pin สำหรับอุปกรณ์ Blynk เสมอ หากต้องการใช้งานต่างหน้าที่ ไม่ควรมีเลข virtual pin ที่ซ้ำกัน
{% endhint %}

![](/files/-LxWomPt9FLfbDK3fn2M)

### ภายในแอพพลิเคชั่น Blynk

7\. เปิดแอพพลิเคชั่นบลิ๊ง และกดที่ปุ่ม New Project เพื่อทำการสร้าง Project ใหม่

![](/files/-LxWpjmX9h3TPcYib5BT)

8\. ตั้งชื่อ Project ใหม่ โดยสามารถตั้งชื่ออะไรก็ได้ ในตัวเลือก Choose Device ให้เลือกอุปกรณ์เป็น ESP8266 และ Connection Type เป็น WiFi

{% hint style="warning" %}
เนื่องจากตัวอย่างการใช้งานนี้ใช้งาน Maker Playground Baseboard ที่ประกอบด้วย ESP8266 และใช้งาน ESP8266 เป็นตัวเชื่อมต่อกับโครงข่ายอินเตอร์เน็ต ผู้ใช้งานจำเป็นต้องเปลี่ยนตัวเลือกนี้หากอุปกรณ์ของผู้ใช้แตกต่างไปจากตัวอย่าง
{% endhint %}

![](/files/-LxWr1wA5L6EmGXshymi)

9\. เมื่อสร้าง project ใหม่สำเร็จ หน้าแดชบอร์ดของ Project จะปรากฏขึ้นดังรูป

![](/files/-LxWr8mCQet_qL0SAreN)

10\. ในหน้าแดชบอร์ดตามที่แสดงในข้อ 9 ให้ทำการจิ้มลงบนพื้นที่ตรงกลางหนึ่งครั้ง หรือจิ้มหน้าจอค้างไว้และเลื่อนไปทางซ้าย แถบ Widget Box จะปรากฏขึ้นจากทางด้านขวาของจอภาพ ทำการเพิ่ม Button และ Slider (หรือจะใช้งาน Virtical Slider ก็ได้เช่นกัน)

![](/files/-LxWrlWG49bWkyH0fEG8)

11\. เมื่อ Button และ Slider ถูกเพิ่มเข้ามาในแดชบอร์ด จะได้อุปกรณ์ในลักษณะดังภาพ

{% hint style="info" %}
ผู้ใช้งานสามารถจัดวางและปรับขนาดของอุปกรณ์ใน Blynk แอพพลิเคชั่นได้
{% endhint %}

![](/files/-LxWs7CspedN0NHXqF5n)

12\. จิ้มที่ตัวอุปกรณ์เพื่อทำการตั้งค่า ผู้ใช้งานสามารถเปลี่ยนชื่อของอุปกรณ์ได้ ในขั้นตอนนี้ควรตรวจสอบเลข Virtual pin ให้ตรงกับเลขที่ตั้งไว้ในซอฟต์แวร์เมกเกอร์เพลย์กราวน์ โดยในตัวอย่างนี้

#### การตั้งค่าสำหรับ Button

* เปลี่ยน OUTPUT ของ Button เป็น Virtual pin 0
* เปลี่ยน MODE ของ Button เป็น SWITCH 

{% hint style="info" %}

* PUSH จะใช้งานเหมือนสวิทช์กดติด ปล่อยดับ
* SWITCH จะใช้งานเหมือนสวิทช์ไฟทั่วไป กดหนึ่งครั้งเพื่อเปิด กดอีกหนึ่งครั้งเพื่อปิด
  \*
  {% endhint %}

![](/files/-LxWsv-xpytlovldbDfn)

#### การตั้งค่าสำหรับ Slider

* เปลี่ยน OUTPUT ของ Slider เป็น Virtual pin 1
* เปลี่ยนช่วงค่าของ OUTPUT เป็น 0 ถึง 100
* เปลี่ยน DECIMALS เป็น # ตัวเดียว เพื่อให้ใช้เลขจำนวนเต็มที่ไม่มีทศนิยม

![](/files/-LxWsoq_qTLxn-MUCjM5)

13\. เมื่อกดปุ่ม OK จากขั้นตอนก่อนหน้า หน้าแดชบอร์ดจะปรากฏอุปกรณ์ที่ตั้งค่าแล้วดังรูป

![](/files/-LxWw2WZ5EkmF5WORXam)

14\. หน้าการตั้งค่า Project จะเปิดขึ้นมา ให้ผู้ใช้ทำการคัดลอก AUTH TOKEN key นี้ไปใส่ในช่อง Auth Token ในการตั้งค่าการทำงานของ Blynk ที่อยู่ในซอฟต์แวร์เมกเกอร์เพลย์กราวน์

{% hint style="warning" %}
ตัวอักษรเล็กและใหญ่ใน AUTH TOKEN key นั้นจำเป็นต้องกรอกให้เหมือนกับ AUTH TOKEN key ที่แสดงในหน้าการตั้งค่า Project ของแอพพลิเคชั่น Blynk ผู้ใช้งานควรใช้วิธีการกดปุ่ม E-Mail เพื่อทำการส่ง AUTH TOKEN key ผ่านทาง email เพื่อป้องกันการกรอกผิด
{% endhint %}

นอกจากนี้ผู้ใช้งานสามารถแก้ไขการตั้งค่าของ Project หากมีการตั้งค่าผิดพลาดในขั้นตอนการสร้าง Project

![](/files/-LxWwVi0PElo7TSJ95-6)

### ภายในซอฟต์แวร์เมกเกอร์เพลย์กราวน์

15\. ในหน้า Device / Device Configuration ของเมกเกอร์เพลย์กราวน์ซอฟต์แวร์ ให้นำ AUTH TOKEN key ที่ได้จากแอพพลิกเคชั่น Blynk มาใส่ให้ถูกต้อง จากนั้นกำหนดชื่อและรหัสผ่านของ WiFi ที่สามารถออกอินเตอร์เน็ตได้

{% hint style="info" %}
WiFi นี้จะต้องอยู่บนเครือข่ายที่สามรถเชื่อมต่อกับอินเตอร์เน็ตได้ทันที ไม่ผ่านการเข้ารหัสที่ต้องใช้บัญชีผู้ใช้หรือพร๊อกซี่ใดๆ และต้องเป็นการเข้ารหัสประเภท WEP, WPA2-PSK แบบ AES หรือ TKIP
{% endhint %}

{% hint style="warning" %}
หากผู้ใช้งานใช้อุปกรณ์ ESP8266 หรือ ESP32 โปรตรวจสอบให้มั่นใจว่า WiFi ที่ใช้เป็นคลื่นความถี่ 2.4GHz
{% endhint %}

![](/files/-LxWx1UlbTI9yfmXXsIv)

16\. ไปที่หน้าเมนู Diagram เพื่อทำการต่อบล็อกคำสั่ง

![](/files/-LxWxC0RutEcM0e0kZMO)

17\. คลิกที่ปุ่ม Add Condition หรือทำการคลิกขวาที่หน้ากระดานแล้วไปที่ Add Condition เพื่อทำการสร้างบล็อกเงื่อนไข จำนวน 2 บล็อก และในแต่บล็อกให้เพิ่ม VirtualButton1 เข้าไปด้านใน

![](/files/-LxWxkHEMR3-P2lNbh8x)

18\. แก้ไข Condition ภายใน VirtualButton1 อันใดอันหนึ่งให้เป็น **Not press**

![](/files/-LxWy3XtwJnfN4PNiTdb)

จะได้ผลดังรูปด้านล่าง

![](/files/-LxWyKP2GENHD2UQuoTx)

19\. คลิกที่ปุ่ม Add Scene หรือทำการคลิกขวาที่หน้ากระดานแล้วไปที่ Add Scene เพื่อทำการสร้างบล็อกเงื่อนไข จำนวน 2 บล็อก และในแต่บล็อกให้เพิ่ม LED1 เข้าไปด้านใน

![](/files/-LxWylgjqQkR8V0gW0e1)

20\. แก้ไขสถาณะของหลอดไฟ LED1 ในบล็อกซีนอันใดอันหนึ่งจาก ON ให้เป็น OFF

![](/files/-LxWzZyLT6GQRgH40igA)

21\. บล็อกซีนที่มีสถาณะของหลอดไฟ LED1 เป็น ON ให้แก้ไข Brightness ให้เป็นบล็อก value สีม่วง และตั้งค่าให้ใช้งาน VirtualSlider1's Value ดังรูป

![](/files/-LxX-AgA0eoVYs3EQ5IU)

22\. เชื่อมต่อไดอะแกรมเข้าด้วยกัน และกดปุ่ม Upload โปรแกรมไปยังไมโครคอนโทรลเลอร์

![](/files/-LxX-YeWjM0bCs4EpUae)

23\. หลังจากการอัพโหลดโปรแกรมเสร็จสิ้น กดปุ่มเล่นใน Blynk แอพพลิเคชั่น

![](/files/-LxX0IHZSsl6Tmf_fW7h)

24\. ทดลองกด BUTTON และปรับค่า SLIDER จากนั้นลองสังเกตผลที่ได้

![](/files/-LxX1L_rFwEipMe1kRNh)