LVGL Development
หัวข้อนี้เป็นการแนะนำเพื่อติดตั้ งการแสดงภาพของแอพพลิเคชั่น (GUI) ผ่านทาง Window Subsystem Linux : WSL คิดว่าหลายคนน่าจะมี WSL อยู่บนเครื่องแล้ว ถ้าใครยังไม่ได้ติดตั้งลองดูตามนี้ครับ
คำเตือน : "ภายในลิ้งมีสองหัวข้อนะครับ" ใครเกิดปัญหาในการติดตั้งสามารถหลังไมค์ใน Classroom เพื่อสอบถามหรือ comment ทิ้งไว้ได้เลยครับ
- 1.ลองเปิด WSL ของเราดูก่อนครับ ว่ายังใช้งานได้ไหมครับ ถ้าใช้งานไม่ได้ให้บอกพี่ๆ RA ใน Group Line ครับ ถ้าใช้งานได้จะเป็นดังรูปด้านล่าง แตกต่างกันเพียงชื่อ User
"คำเตือน : "ลิ้งมีสองหัวข้อนะครับ" ใครเกิดปัญหาในการติดตั้งสามารถหลังไมค์ใน Classroom เพื่อสอบถามหรือ comment ทิ้ งไว้ได้เลยครับ
2. ทำการติดตั้ง โปรแกรม VcXsrv ลงบนเครื่องของเรา เพื่อใช้ในการแสดงหน้า Gui ที่ใช้ในการเขียนโปรแกรม ดังลิ้งด้านล่าง VcXsrv Windows X Server download | SourceForge.net กด Next ไปเรื่อยๆจนโหลดเสร็จ ให้กด Finish ครับ จะได้โปรแกรมหน้าตาดัง รูป
3. คลิกขวาที่ icon Xlaunch → เลือก Properties
- ใส่ข้อความที่ Target
"C:\Program Files\VcXsrv\xlaunch.exe" :0 -ac -terminate -lesspointer -multiwindow -clipboard -wgl -dpi auto
- กด apply แล้วกด ok (ถ้าใครขึ้นหน้าให้รันผ่าน administrator ให้กด ok)
4. กดเปิด XLaunch ผ่าน icon แล้วกด next จนถึงหน้า Extra settings แล้วทำการคลิกเช็ค Disable access control ดังภาพด้านล่าง
5. เข้าหน้า Powershell ด้วย administrator เพื่อตรวจสอบว่าพร้อมทำงานหรือยัง
netstat -abno|findstr 6000
จากรูปแสดงว่าพร้อมทำงานแล้ว
ถ้าไม่ได้พิมคำสั่งจะไม่ขึ้นอะไรเลย6. หลังจากนั้นเปิด Ubuntu WSL2 บนเครื่องแล้วพิมคำสั่งดังนี้
# install terminal application
$ sudo apt update && sudo apt-get install terminator
# Export Xserver Display
$ DISPLAY=$(cat /etc/resolv.conf | grep nameserver | awk '{print $2}'):0 terminator &
ถ้าขึ้นหน้าต่างดังรูปด้านล่างถือว่าผ่าน
7. ถ้าผ่านแล้วให้ทำการกดปิดและกด Ctrl + c เพื่อยกเลิกการแสดงแล้วทำการโหลดแพคเกต และติดตั้ง environment LVGL ที่จะใช้งานกัน ทุกคนต้องมี Visual studio code บนเครื่องเพื่อใช้งาน
คำเตือน : "ภายในลิ้งมีสองหัวข้อนะครับ" ใครเกิดปัญหาในการติดตั้งสามารถหลังไมค์ใน Classroom เพื่อสอบถามหรือ comment ทิ้งไว้ได้เลยครับ
# Test environment LVGL
$ git clone --recursive https://github.com/lvgl/lv_sim_vscode_sdl
$ sudo apt-get update && sudo apt-get install -y build-essential libsdl2-dev
$ cd lv_sim_vscode_sdl && code .
8. หลังจากใส่คำสั่งด้านล่างเสร็จจะขึ้นหน้่าต่างดังรูป
9. กด F5 จะขึ้นหน้าต่างดังรูป
10. กดปิดแล้วกด enter ที่ terminal แล้วทำการพิมคำสั่งลงใน terminal ดังนี้
$ cd build/bin/
$ export DISPLAY=$(cat /etc/resolv.conf | grep nameserver | awk '{print $2}'):0
$ ./demo
จะได้หน้าต่างดังรูป
