วิธีการ Cross-Compile Qt 5 สำหรับ Raspberry Pi ตอนที่ 2
![Basic cross compile Qt application 01](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_01.png)
ตั้งค่า Qt Creator:
หลังจาก Compile Qt สำหรับใช้กับ Raspberry Pi เรียบร้อย เราก็จะได้ Environment ที่สามารถ Cross-compile Qt ได้ โดยการ Cross-compile จะเป็นการเขียนโปรแกรมบนเครื่อง PC แล้ว Deploy เอา Application ที่ Compile เสร็จแล้วไป Run บนบอร์ด Raspberry Pi ผ่านทาง LAN
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_17-1.png)
1. Mount Image raspbian.img ขึ้นมา
พิมพ์ >> sudo mount -o loop,offset=67108864 ~/opt/raspbian.img /mnt/rasp-pi-rootfs/
2. เปิดบอร์ด Raspberry Pi ให้พร้อมใช้งานและเชื่อมต่ออยู่ใน วง LAN เดียวกันกับเครื่อง PC
3. เปิด Qt Creator บน Ubuntu ขึ้นมา
4. ไปที่ Menu Tool >> options…
5. เลือกหัวข้อ Device ที่เมนูด้านซ้าย
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_18.png)
6. คลิก Add เลือก Generic Linux Device แล้วคลิก Start wizard
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_19.png)
– ตั้งชื่อ Device เป็น “Raspberry Pi”
– ตั้ง IP Address ไปที่บอร์ด RPi
– ใส่ Username สำหรับ Login เข้าบอร์ด โดยปกติจะเป็น “pi”
– ใส่ Password สำหรับ Login เข้าบอร์ด โดยปกติจะเป็น “raspberry”
– กด Next และ Finish
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_20.png)
– ปรากฏหน้าต่าง Device Test “Device test finished successfully.”
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_21.png)
7. เลือกหัวข้อ Build & Run ที่เมนูด้านซ้าย
– เลือกแท็บ Compilers
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_22.png)
– คลิก Add เลือก GCC
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_23.png)
– ตั้งชื่อ Compiler เป็น “Raspberry Pi Toolchain”
– เลือก Path Toolchain ไปที่ /home/tee/opt/tools/arm-bcm2708/gcc-linaro-arm-linux-gnueabihf-raspbian-x64/bin/arm-linux-gnueabihf-g++
– คลิก Apply
8. เลือกแท็บ Qt Versions
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_24.png)
– คลิก Add
– ตั้ง Path ไปที่ “/mnt/rasp-pi-rootfs/usr/local/qt5pi/bin/qmake”
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_25.png)
– คลิก Apply
9. เลือกแท็บ Kits
– คลิก Add
– ตั้งชื่อเป็น “Qt 5.0 Raspberry Pi”
– เลือก Device Type เป็น Generic Linux Device
– และ Device จะเป็น Raspberry Pi
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_26.png)
– ตั้ง sysroot ไปที่ /mnt/rasp-pi-rootfs
– ตั้ง Compiler เป็น Raspberry Pi Toolchain
– หัวข้อ Debug ให้ Add ใหม่
– ตั้งชื่อว่า “debugger”
– เลือก Path ไปที่ /home/tee/opt/tools/arm-bcm2708/gcc-linaro-arm-linux-gnueabihf-raspbian-x64/bin/arm-linux-gnueabihf-gdb
– คลิก Apply
– กลับไปที่แท็บ Kits ตั้งหัวข้อ Debugger เป็น debugger (ที่พึ่ง Add เข้ามา)
– เลือก Qt version เป็น Qt 5.5.1 (qt5pi)
– คลิก OK
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_27.png)
สร้าง Project และ Deploy:
!!! Note ก่อนจะใช้งาน Qt Cross-compile ต้อง Mount Image raspbian.img ก่อนทุกครั้
พิมพ์ >> sudo mount -o loop,offset=67108864 ~/opt/raspbian.img /mnt/rasp-pi-rootfs/
1. ไปที่เมนู File >> New File or Project…
2. Choose a template เลือก Application และ Qt Widgets Application
3. ตั้งชื่อและไดเรกทอรี่ที่เก็บ Project
4. Kit Selection เลือก Qt5 Raspberry Pi (จะเลือกทั้ง 2 อันก็ได้)
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_28.png)
5. เมื่อสร้าง Project เรียบร้อยแล้ว ให้ไปที่ File .pro ของ Project
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_30.png)
6. เพิ่ม Code ลงใน File .pro ดังนี้
target.path = /home/pi/deploy_qt
INSTALLS += target
![Basic cross compile Qt application 29](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_29.png)
7. ไปที่หน้า Design ทดลองสร้างหน้า UI โดยใช้ Widget LCD Number และ Dial
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_31.png)
8. คลิกขวาที่ Widget Dial เลือก Go to slot…
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_32.png)
9. เลือก signal เป็น valueChanged(int)
![Basic cross compile Qt application 41](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_41.png)
10. โปรแกรมจะสร้างฟังก์ชั่น
void MainWindow::on_dial_valueChanged(int value) ในไฟล์ mainwindows.cpp ขึ้นมาให้อัตโนมัติ
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_33-1.png)
11. เขียนโปรแกรมเพื่อนำค่า Value จากการหมุน Dial มาแสดงผลยัง LCD Number โดยเพิ่ม Code ลงไปใน void MainWindow::on_dial_valueChanged(int value) ดังนี้
ui->lcdNumber->display(value);
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_42.png)
12. ทดลอง Deploy โปรแกรมขึ้นไป Run บนบอร์ด >> ผลที่ได้ ทำไม UI ไม่เหมือนที่ออกแบบบน PC ?!??
![Basic cross compile Qt application 35](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_35.png)
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_34.png)
13. ตั้งค่า Project โดยไปที่เมนู Project
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_36.png)
– เลือกแท็บ Run ของ Kit Qt 5 Raspberry Pi
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_37.png)
14. เพิ่ม “-platform xcb” ลงในช่อง Arguments
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_38.png)
15. Compile และ Deploy Program ไปยังบอร์ด Raspberry Pi โดยกดปุ่ม Play
![Basic cross compile Qt application 40](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_40.png)
![Basic cross compile Qt application 39](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/131_Basic_cross-compile_Qt_application_39.png)