บทช่วยสอน PyQt5 พร้อมตัวอย่าง: การสร้าง Python GUI ที่สร้างด้วย Qt

หัวข้อด้านล่างนี้จะนำคุณตั้งแต่พื้นฐานของ PyQt ไปจนถึงการติดตั้ง วิดเจ็ตหลัก เลย์เอาต์ และธีม พร้อมตัวอย่างที่สามารถใช้งานได้จริง

PyQt คืออะไร?

ไพคิว คือ Python Qt เป็นไลบรารีที่ใช้งานร่วมกับชุดเครื่องมือโอเพนซอร์ส Qt ซึ่งทำหน้าที่เป็นเฟรมเวิร์กสำหรับการพัฒนาแอปพลิเคชันข้ามแพลตฟอร์ม Qt เป็นที่นิยมอย่างมาก C++ เฟรมเวิร์กสำหรับการเขียนแอปพลิเคชัน GUI สำหรับแพลตฟอร์มเดสก์ท็อป มือถือ และฝังตัวหลัก ๆ ทั้งหมด (รองรับ Linux) Windows, macOS, Android, iOS, Raspberry Pi และอื่นๆ)

PyQt เป็นซอฟต์แวร์ฟรีที่พัฒนาและดูแลโดย Riverbank Computing บริษัทที่ตั้งอยู่ในประเทศอังกฤษ ในขณะที่ Qt พัฒนาโดยบริษัทสัญชาติฟินแลนด์ชื่อ The Qt Company

คุณสมบัติของ PyQt

นี่คือคุณสมบัติที่สำคัญของ PyQt:

PyQt ประกอบด้วยคลาสมากกว่าหกร้อยคลาส ครอบคลุมคุณสมบัติหลากหลาย เช่น:

• อินเทอร์เฟซผู้ใช้แบบกราฟิก
• ฐานข้อมูล SQL
• ชุดเครื่องมือเว็บ
• การประมวลผล XML
• ระบบเครือข่าย

คุณสมบัติเหล่านี้สามารถนำมาผสมผสานกันเพื่อสร้างส่วนติดต่อผู้ใช้ขั้นสูง รวมถึงแอปพลิเคชันแบบสแตนด์อโลนได้ บริษัทชั้นนำมากมายในทุกอุตสาหกรรมใช้ Qt ตัวอย่างเช่น LG, Mercedes, AMD, Panasonic และ Harman

เวอร์ชัน PyQt

PyQt มีให้เลือกสองเวอร์ชัน คือ PyQt4 และ PyQt5 PyQt4 มีโค้ดเชื่อมต่อสำหรับเวอร์ชัน 4.x และ 5.x ของเฟรมเวิร์ก Qt ในขณะที่ PyQt5 มีการเชื่อมต่อเฉพาะเวอร์ชัน 5.x เท่านั้น ดังนั้น PyQt5 จึงไม่สามารถใช้งานร่วมกับโมดูลที่เลิกใช้งานแล้วของเวอร์ชันเก่าได้ ในบทเรียน GUI ของ PyQt นี้ เราจะใช้ PyQt5 ในการสาธิตตัวอย่าง นอกจากสองเวอร์ชันนี้แล้ว Riverbank Computing ยังมี PyQt3D อีกด้วย Python ส่วนเชื่อมต่อสำหรับเฟรมเวิร์ก Qt3D Qt3D เป็นเฟรมเวิร์กแอปพลิเคชันที่ใช้ในการสร้างระบบจำลองแบบเรียลไทม์ด้วยการเรนเดอร์ 2 มิติ/3 มิติ

วิธีการติดตั้ง PyQt5

ในบทช่วยสอน PyQt5 นี้ เราจะเห็นวิธีการติดตั้ง PyQt สองวิธี:

• การใช้ไฟล์ Wheel
• การสร้างและติดตั้งจากแหล่งที่มา

Qt (อ่านว่า คัท) เป็นระบบที่ซับซ้อน และฐานโค้ด PyQt ประกอบด้วยการคอมไพล์ C++ และ Python โค้ดส่วนนี้มีความซับซ้อน ดังนั้น การสร้างและติดตั้งจากซอร์สโค้ดจึงเป็นกระบวนการที่ซับซ้อนกว่าเมื่อเทียบกับระบบอื่นๆ Python ไลบรารีต่างๆ อย่างไรก็ตาม คุณสามารถติดตั้ง PyQt5 ได้อย่างง่ายดายโดยใช้ wheels

ติดตั้งแบบมีล้อ

ล้อคือมาตรฐานใหม่ Python รูปแบบบรรจุภัณฑ์และการจัดจำหน่าย พูดอย่างง่าย ๆ ล้อคือไฟล์ ZIP ที่มีชื่อพิเศษและ .หว นามสกุลไฟล์. สามารถติดตั้งล้อได้โดยใช้ pip (Pythonตัวจัดการแพ็คเกจ) ซึ่งรวมอยู่ในค่าเริ่มต้นในเวอร์ชันล่าสุดของ Python.

ดังนั้นถ้าคุณมี Python ติดตั้ง 3.4 หรือใหม่กว่าแล้ว คุณมี pip แล้ว อย่างไรก็ตาม หากคุณกำลังใช้เวอร์ชันเก่ากว่า Pythonคุณต้องดาวน์โหลดและติดตั้ง pip ก่อนดำเนินการต่อ คุณสามารถค้นหาคำแนะนำได้ที่ลิงก์นี้: https://pypi.org/project/pip/.

วิธีการติดตั้ง PyQt5:

ขั้นตอน 1) เปิดพรอมต์คำสั่ง
เปิด Command Prompt หรือ PowerShell ในของคุณ Windows เครื่อง

ขั้นตอน 2) พิมพ์ต่อไปนี้

 pip install PyQt5

ขั้นตอน 3) การติดตั้งสำเร็จ
ขั้นตอนนี้ในบทช่วยสอน PyQt5 นี้จะดาวน์โหลดแพ็คเกจ PyQt5 whl (ประมาณ 50 MB) และติดตั้งลงในระบบของคุณ

หรือคุณสามารถดาวน์โหลด Windows ไบนารีสำหรับเวอร์ชันของ Python ติดตั้งบนคอมพิวเตอร์ของคุณ

เมื่อเสร็จแล้ว ให้ไปยังส่วนถัดไปในบทช่วยสอน PyQt5 นี้เพื่อเขียนแอป GUI แรกของคุณ

PyQt พื้นฐาน Concepts และโปรแกรมต่างๆ

เมื่อคุณติดตั้ง PyQt5 บนคอมพิวเตอร์ของคุณเรียบร้อยแล้ว คุณก็พร้อมที่จะเขียนโปรแกรมได้แล้ว Python แอปพลิเคชัน GUI

ในบทเรียน PyQt5 นี้ เรามาเริ่มต้นด้วยแอปพลิเคชันง่ายๆ ที่จะแสดงหน้าต่างว่างเปล่าบนหน้าจอของคุณกัน

จุดไฟของคุณ Python IDLE และพิมพ์ตามนี้:

โปรแกรม 1

import sys
from PyQt5.QtWidgets import QApplication, QWidget
if __name__ == "__main__":
    app = QApplication(sys.argv)
    w = QWidget()
    w.resize(300,300)
    w.setWindowTitle("Guru99")
    w.show()
    sys.exit(app.exec_())

บันทึกไฟล์เป็น app.py (ชื่อไฟล์ไม่สำคัญ) แล้วกด F5 เพื่อเรียกใช้โปรแกรม หรืออีกวิธีหนึ่งคือ ดับเบิ้ลคลิกไฟล์ที่บันทึกไว้เพื่อเรียกใช้แอปพลิเคชัน หากคุณทำทุกอย่างถูกต้อง หน้าต่างใหม่จะเปิดขึ้นพร้อมชื่อเรื่อง Guru99 ดังแสดงด้านล่าง

เยี่ยม! มันใช้งานได้แล้ว ถึงแม้จะไม่มาก แต่ก็เพียงพอที่จะเข้าใจพื้นฐาน ต่อไปในบทเรียน PyQt นี้ เราจะมาดูรายละเอียดว่าแต่ละบรรทัดในโปรแกรมของคุณทำอะไรบ้าง

from PyQt5.QtWidgets import QApplication, QWidget

คำสั่งนี้จะนำเข้าโมดูลทั้งหมดที่คุณต้องการเพื่อสร้าง GUI ลงในเนมสเปซปัจจุบัน โมดูล QtWidgets มีวิดเจ็ตหลักทั้งหมดที่คุณจะใช้ในสิ่งนี้ Python กวดวิชา Qt

app = QApplication(sys.argv)

ที่นี่ คุณกำลังสร้างอ็อบเจ็กต์ของคลาส QApplication ขั้นตอนนี้จำเป็นสำหรับ PyQt5 แอป UI ทุกแอปจะต้องสร้างอินสแตนซ์ของ QApplication เพื่อเป็นจุดเริ่มต้นเข้าสู่แอป หากคุณไม่สร้างมันขึ้นมา ข้อผิดพลาดจะปรากฏขึ้น

sys.argv คือรายการพารามิเตอร์บรรทัดคำสั่งที่คุณสามารถส่งผ่านไปยังแอปพลิเคชันเมื่อเปิดใช้งานผ่านเชลล์หรือในขณะที่ทำให้อินเทอร์เฟซเป็นแบบอัตโนมัติ

ในตัวอย่าง PyQt5 นี้ คุณไม่ได้ส่งอาร์กิวเมนต์ใดๆ ไปยัง QApplication ดังนั้น คุณสามารถแทนที่ด้วยโค้ดด้านล่างและไม่จำเป็นต้องนำเข้าโมดูล sys ด้วยซ้ำ

app = QApplication([])

w = QWidget()

ขั้นต่อไป เราจะสร้างอ็อบเจ็กต์ของคลาส QWidget ซึ่ง QWidget เป็นคลาสพื้นฐานของอ็อบเจ็กต์ UI ทั้งหมดใน Qt และแทบทุกอย่างที่คุณเห็นในแอปคือวิดเจ็ต ซึ่งรวมถึงกล่องโต้ตอบ ข้อความ ปุ่ม แถบ และอื่นๆ คุณสมบัติที่ช่วยให้คุณออกแบบอินเทอร์เฟซผู้ใช้ที่ซับซ้อนได้คือสามารถซ้อนวิดเจ็ตได้ กล่าวคือ คุณสามารถมีวิดเจ็ตอยู่ภายในวิดเจ็ต ซึ่งอยู่ภายในวิดเจ็ตอีกอันหนึ่ง คุณจะเห็นสิ่งนี้ในการดำเนินการในส่วนถัดไป

w.resize(300,300)

วิธีการปรับขนาดของคลาส QWidget ช่วยให้คุณสามารถกำหนดขนาดของวิดเจ็ตใดๆ ได้ ในกรณีนี้ คุณได้ปรับขนาดหน้าต่างเป็น 300px คูณ 300px

ในที่นี้ คุณควรจำไว้ว่าวิดเจ็ตสามารถซ้อนกันได้ โดยวิดเจ็ตที่อยู่นอกสุด (กล่าวคือ วิดเจ็ตที่ไม่มีวิดเจ็ตแม่) เรียกว่า หน้าต่าง (Window)

w.setWindowTitle("Guru99")

เมธอด `setWindowTitle()` อนุญาตให้คุณส่งสตริงเป็นอาร์กิวเมนต์ ซึ่งจะตั้งชื่อหน้าต่างให้เป็นสตริงที่คุณส่ง ในตัวอย่างของ PyQt5 แถบชื่อเรื่องจะแสดงว่า "title bar" Guru99.

w.show()

show() เพียงแสดงวิดเจ็ตบนหน้าจอมอนิเตอร์

sys.exit(app.exec_())

app.exec_() วิธีการเริ่มต้น Qt/C++ ห่วงเหตุการณ์ อย่างที่คุณทราบ PyQt ส่วนใหญ่จะเขียนด้วย C++ และใช้กลไก event loop เพื่อทำการประมวลผลแบบขนาน app.exec_() จะส่งการควบคุมไปยัง Qt ซึ่งจะออกจากแอปพลิเคชันก็ต่อเมื่อผู้ใช้ปิดแอปพลิเคชันจาก GUI เท่านั้น นั่นเป็นเหตุผลว่าทำไม Ctrl+C จึงไม่สามารถออกจากแอปพลิเคชันได้เหมือนในโปรแกรมอื่นๆ Python โปรแกรมต่างๆ เนื่องจาก Qt สามารถควบคุมแอปพลิเคชันได้ Python เหตุการณ์จะไม่ถูกประมวลผลเว้นแต่เราจะตั้งค่าไว้ภายในแอปพลิเคชัน นอกจากนี้ โปรดสังเกตว่าเมธอด exec มีเครื่องหมายขีดล่างในชื่อ เนื่องจาก exec() เคยเป็นคำสงวนสิทธิ์มาก่อนแล้วใน Python และเครื่องหมายขีดล่างช่วยแก้ปัญหาความขัดแย้งในการตั้งชื่อ

เหนือหน้าต่างที่ว่างเปล่า

ในส่วนก่อนหน้านี้ คุณได้เรียนรู้วิธีการสร้างวิดเจ็ตพื้นฐานใน Qt แล้ว ตอนนี้ถึงเวลาสร้างอินเทอร์เฟซที่ซับซ้อนมากขึ้นซึ่งผู้ใช้สามารถโต้ตอบได้อย่างแท้จริง เริ่มต้นกันเลย IDLE และเขียนข้อความต่อไปนี้

import sys
from PyQt5.QtWidgets import QApplication, QWidget, QLabel, QPushButton, QMessageBox

def dialog():
    mbox = QMessageBox()

    mbox.setText("Your allegiance has been noted")
    mbox.setDetailedText("You are now a disciple and subject of the all-knowing Guru")
    mbox.setStandardButtons(QMessageBox.Ok | QMessageBox.Cancel)
            
    mbox.exec_()

if __name__ == "__main__":
    app = QApplication(sys.argv)
    w = QWidget()
    w.resize(300,300)
    w.setWindowTitle("Guru99")
    
    label = QLabel(w)
    label.setText("Behold the Guru, Guru99")
    label.move(100,130)
    label.show()

    btn = QPushButton(w)
    btn.setText('Beheld')
    btn.move(110,150)
    btn.show()
    btn.clicked.connect(dialog)

    
    w.show()
    sys.exit(app.exec_())

บันทึกไฟล์เป็น appone.py หรือชื่ออะไรก็ได้ที่คุณต้องการ แล้วกด F5 เพื่อเรียกใช้โปรแกรม หากคุณไม่ได้ทำผิดพลาดใดๆ IDLE จะเปิดหน้าต่างใหม่พร้อมข้อความและปุ่มดังรูปด้านล่าง

1. เมื่อคุณคลิกที่ปุ่มในหน้าต่างแรก กล่องข้อความใหม่จะเปิดขึ้นพร้อมข้อความที่คุณเขียน
2. ตอนนี้คุณสามารถคลิกที่ปุ่มซ่อนรายละเอียด/แสดงรายละเอียดเพื่อสลับการแสดงข้อความเพิ่มเติม

อย่างที่คุณเห็น เนื่องจากเราไม่ได้ตั้งชื่อหน้าต่างใดๆ ในกล่องข้อความ ระบบจึงตั้งชื่อเริ่มต้นให้โดยอัตโนมัติ Python ตัวเอง

ตอนนี้มันทำงานได้แล้ว ลองมาดูโค้ดเพิ่มเติมที่คุณได้เพิ่มเข้าไปในตัวอย่าง PyQt5 ก่อนหน้านี้กัน

from PyQt5.QtWidgets import QApplication, QWidget, QLabel, QPushButton, QMessageBox

สิ่งนี้จะนำเข้าวิดเจ็ตเพิ่มเติมบางส่วนที่คุณใช้ในตัวอย่าง PyQt5 ได้แก่ QLabel, QPushButton และ QMessageBox.

def dialog():
    mbox = QMessageBox()

    mbox.setText("Your allegiance has been noted")
    mbox.setDetailedText("You are now a disciple and subject of the all-knowing Guru")
    mbox.setStandardButtons(QMessageBox.Ok | QMessageBox.Cancel)
            
    mbox.exec_()

ที่นี่ คุณได้กำหนดวิธีการที่ชื่อว่ากล่องโต้ตอบซึ่งจะสร้างวิดเจ็ตกล่องข้อความและตั้งค่าข้อความบางส่วนให้กับปุ่มและฟิลด์อื่น ๆ

วิธีการโต้ตอบถูกเรียกจากบล็อกหลักของโปรแกรมเมื่อมีการกดปุ่มในวิดเจ็ตเฉพาะ (ในกรณีนี้คือ btn PushButton) เหตุการณ์คลิกที่ทริกเกอร์บนปุ่มนั้นทำให้ฟังก์ชันนี้ดำเนินการ ฟังก์ชันดังกล่าวเรียกว่า slot ใน Qt และคุณจะได้เรียนรู้เพิ่มเติม สัญญาณ และ สล็อต ในย่อหน้าถัดไป

if __name__ == "__main__":
    app = QApplication(sys.argv)
    w = QWidget()
    w.resize(300,300)
    w.setWindowTitle("Guru99")

นี่คือส่วนหลักของแอป และเช่นเดียวกับตัวอย่างก่อนหน้านี้ คุณเริ่มต้นด้วยการสร้างอินสแตนซ์ของ QApplication ตามด้วยวิดเจ็ตอย่างง่าย นั่นคืออินสแตนซ์ของ QWidget

label = QLabel(w)
    btn = QPushButton(w)

คุณได้เพิ่มวิดเจ็ตใหม่สองรายการในแอปพลิเคชันนี้: QLabel และ QPushButton QLabel ใช้เพื่อพิมพ์ข้อความที่ไม่สามารถแก้ไขได้หรือตัวยึดตำแหน่งภายในวิดเจ็ต ในขณะที่ QPushButton ใช้เพื่อสร้างปุ่มที่คลิกได้

สิ่งสำคัญที่ต้องสังเกตที่นี่คือเมื่อคุณสร้างป้ายกำกับและวัตถุ btn คุณกำลังส่งวัตถุหน้าต่าง (w) ไปยังตัวสร้างของ QLabel และ QPushButton นี่คือวิธีการทำงานของการซ้อนใน PyQt5 ในการสร้างวิดเจ็ตภายในวิดเจ็ตอื่น คุณจะต้องส่งการอ้างอิงของวิดเจ็ตพาเรนต์ไปยังคอนสตรัคเตอร์ของเด็ก

label.move(100,130)
btn.move(110,150)

move() ใช้เพื่อกำหนดตำแหน่งของวิดเจ็ตโดยคำนึงถึงวิดเจ็ตหลัก ในกรณีแรก ป้ายกำกับจะถูกย้าย 100px จากด้านซ้าย และ 130px จากด้านบนของหน้าต่าง

ในทำนองเดียวกัน ปุ่มจะวางไว้ 110px จากด้านซ้าย และ 150px จากด้านบนของหน้าต่าง ตัวอย่างนี้เป็นวิธีการคร่าวๆ เพื่อให้ได้เลย์เอาต์ และโดยทั่วไปไม่ได้ใช้ในการผลิต รวมไว้ที่นี่เพื่อการเรียนรู้เท่านั้น Qt รองรับเลย์เอาต์ที่แตกต่างกันซึ่งคุณจะเห็นรายละเอียดในส่วนถัดไปของบทช่วยสอน PyQt นี้

btn.clicked.connect(dialog)

สุดท้ายนี้ นี่คือตัวอย่างของสัญญาณและสล็อตใน Qt ในแอปพลิเคชันแบบ GUI ฟังก์ชันจะถูกเรียกใช้ตามการกระทำของผู้ใช้ เช่น การวางเมาส์เหนือองค์ประกอบหรือการคลิกปุ่ม การกระทำเหล่านี้เรียกว่า เหตุการณ์- จำได้ว่า app.exec_() วิธีการโอนการควบคุมไปยัง Qt เหตุการณ์ วนซ้ำ นี่คือสิ่งที่ Event Loop มีไว้เพื่อฟังเหตุการณ์และดำเนินการเพื่อตอบสนอง

เมื่อใดก็ตามที่มีเหตุการณ์เกิดขึ้น เช่น ผู้ใช้คลิกปุ่ม วิดเจ็ต Qt ที่เกี่ยวข้องจะเพิ่ม a สัญญาณ- สามารถเชื่อมต่อสัญญาณเหล่านี้ได้ Python ฟังก์ชั่น (เช่นฟังก์ชันไดอะล็อกในตัวอย่างนี้) เพื่อให้ฟังก์ชันดำเนินการเมื่อมีการทริกเกอร์สัญญาณ ฟังก์ชันเหล่านี้เรียกว่า สล็อต ในศัพท์แสง Qt

ต่อมา ไวยากรณ์พื้นฐานในการเรียกใช้ฟังก์ชันสล็อตเพื่อตอบสนองต่อสัญญาณจากเหตุการณ์มีดังนี้:

 widget.signal.connect(slot)

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

ตอนนี้คุณรู้วิธีซ้อนวิดเจ็ตและใช้งานการโต้ตอบโดยใช้สัญญาณและสล็อตแล้ว นี่คือรายการวิดเจ็ตที่มีประโยชน์และคลาสอื่น ๆ ที่คุณสามารถใช้ในแอป PyQt ของคุณ

ส่วนประกอบและวิดเจ็ต

มีวิดเจ็ตจำนวนมากใน PyQt สำหรับการสร้างแอป GUI อย่างไรก็ตาม ด้วย PyQt5 ได้มีการสับเปลี่ยนคลาสออกเป็นโมดูลต่างๆ และมีการแก้ไขใบอนุญาต

ดังนั้น การมีความเข้าใจภาพรวมโครงสร้างของ PyQt5 จึงเป็นสิ่งสำคัญ ในส่วนนี้ คุณจะได้เห็นโครงสร้างภายในของ PyQt5 และเรียนรู้เกี่ยวกับโมดูล ไลบรารี และคลาส API ต่างๆ ที่ PyQt5 จัดให้

โครงสร้างไดเรกทอรี PyQt5

เหล่านี้เป็นโมดูลพื้นฐานที่ใช้โดย Pythonการเชื่อมโยง Qt ของ โดยเฉพาะ PyQt5

• Qt: วิธีนี้รวมคลาส/โมดูลทั้งหมดที่กล่าวถึงด้านล่างเข้าไว้ในโมดูลเดียว ซึ่งจะทำให้แอปพลิเคชันใช้หน่วยความจำเพิ่มขึ้นอย่างมาก อย่างไรก็ตาม การจัดการเฟรมเวิร์กจะง่ายขึ้นเนื่องจากนำเข้าเพียงโมดูลเดียว
• คิวทีคอร์: ประกอบด้วยคลาสหลักที่ไม่ใช่กราฟิกที่ใช้โดยโมดูลอื่น นี่คือที่ที่ลูปเหตุการณ์ Qt สัญญาณ และการเชื่อมต่อสล็อต ฯลฯ ถูกนำมาใช้
• QtWidgets: ประกอบด้วยวิดเจ็ตส่วนใหญ่ที่มีอยู่ใน PyQt5
• คิวทีกุย: ประกอบด้วยส่วนประกอบ GUI และขยายโมดูล QtCore
• QtNetwork: มีคลาสที่ใช้เพื่อดำเนินการเขียนโปรแกรมเครือข่ายผ่าน Qt รองรับเซิร์ฟเวอร์ TCP, ซ็อกเก็ต TCP, ซ็อกเก็ต UDP, การจัดการ SSL, เซสชันเครือข่าย และการค้นหา DNS
• คิวทีมัลติมีเดีย: ให้ฟังก์ชันการทำงานมัลติมีเดียระดับพื้นฐาน
• QtSql: ดำเนินการรวมฐานข้อมูลสำหรับฐานข้อมูล SQL รองรับ ODBC, MySQL, Oracle, SQLiteและ PostgreSQL.

วิดเจ็ต PyQt5

ต่อไปนี้คือรายการวิดเจ็ตที่ใช้บ่อยที่สุดใน PyQt5:

• คิวไลน์แก้ไข: นี่คือช่องป้อนข้อมูลที่อนุญาตให้ผู้ใช้ป้อนข้อความได้หนึ่งบรรทัด

line = QLineEdit()

• QRadioButtonนี่คือช่องป้อนข้อมูลที่มีปุ่มให้เลือก คล้ายกับปุ่มวิทยุใน HTML

rad = QRadioButton("button title")
rad.setChecked(True)  #to select the button by default.

• คคอมโบBox: ใช้เพื่อแสดงเมนูแบบเลื่อนลงพร้อมกับรายการที่เลือกได้

drop = QComboBox(w)
drop.addItems(["item one", "item two", "item three"])

• คิวเช็คBox: แสดงกล่องสี่เหลี่ยมที่เลือกได้ด้านหน้าฉลาก ซึ่งจะถูกกาเครื่องหมายหากเลือก คล้ายกับปุ่มตัวเลือก

check = QCheckBox("button title")

• คิวเมนูบาร์: แถบเมนูจะแสดงเป็นแนวนอนที่ด้านบนของหน้าต่าง คุณสามารถเพิ่มเฉพาะอ็อบเจ็กต์ของคลาส QMenu ลงในแถบนี้ได้เท่านั้น อ็อบเจ็กต์ QMenu เหล่านั้นสามารถบรรจุข้อความ อ็อบเจ็กต์ QAction หรืออ็อบเจ็กต์ QMenu อื่นๆ ได้อีกด้วย
• QToolBar: เป็นแถบแนวนอนหรือบานหน้าต่างที่สามารถเคลื่อนย้ายภายในหน้าต่างได้ อาจมีปุ่มและวิดเจ็ตอื่นๆ
• QTab: ใช้สำหรับแบ่งเนื้อหาของหน้าต่างออกเป็นหลายหน้า ซึ่งสามารถเข้าถึงได้ผ่านแท็บต่างๆ ที่อยู่ด้านบนของวิดเจ็ต ประกอบด้วยสองส่วน คือ แถบแท็บและหน้าแท็บ
• QScrollBar: ใช้สำหรับสร้างแถบเลื่อนที่ช่วยให้ผู้ใช้เลื่อนขึ้นและลงภายในหน้าต่าง ประกอบด้วยแถบเลื่อนที่สามารถเคลื่อนที่ได้ และตัวเลื่อน track และปุ่มสองปุ่มสำหรับเลื่อนแถบเลื่อนขึ้นหรือลง

scroll = QScrollBar()

• QSplitter: ตัวแยกใช้เพื่อแยกเนื้อหาของหน้าต่างเพื่อให้วิดเจ็ตถูกจัดกลุ่มอย่างเหมาะสมและไม่ดูเกะกะ QSplitter เป็นหนึ่งในตัวจัดการเค้าโครงหลักที่มีอยู่ใน PyQt5 และใช้เพื่อแยกเนื้อหาทั้งแนวนอนและแนวตั้ง
• คิวด็อกวิดเจ็ตแบบด็อก (Dock widget) คือหน้าต่างย่อยที่มีคุณสมบัติสองอย่าง คือ สามารถเคลื่อนย้ายภายในหน้าต่างหลักได้ และสามารถด็อกอยู่นอกหน้าต่างหลักไปยังตำแหน่งอื่นบนหน้าจอได้

เค้าโครงและธีม

ในตัวอย่าง PyQt5 ก่อนหน้านี้ คุณเพียงแค่ใช้เมธอด move() และ resize() เพื่อกำหนดตำแหน่งของวิดเจ็ตใน GUI ของคุณ

อย่างไรก็ตาม PyQt มีกลไกการจัดการเค้าโครงที่มีประสิทธิภาพซึ่งสามารถใช้เพื่อสร้างส่วนต่อประสานผู้ใช้ขั้นสูงสำหรับแอปพลิเคชัน ในส่วนนี้ คุณจะได้เรียนรู้เกี่ยวกับคลาสสำคัญสองคลาสที่ใช้ใน Qt เพื่อสร้างและจัดการเลย์เอาต์

1. QBoxแบบ
2. QGridLayout

QBoxแบบ

QBoxเค้าโครงใช้เพื่อจัดแนววิดเจ็ตลูกของเค้าโครงในแถวแนวนอนหรือแนวตั้ง คลาสที่น่าสนใจทั้งสองคลาสที่สืบทอดมาจาก QBoxเค้าโครงคือ:

• QHBoxเค้าโครง: ใช้เพื่อวางวิดเจ็ตลูกในแนวนอน
• QVBoxเค้าโครง: ใช้เพื่อวางวิดเจ็ตลูกในแนวตั้ง

ตัวอย่างเช่น นี่คือวิธีที่ปุ่มสามปุ่มจัดแนวกับ QHBoxเค้าโครงจะมีลักษณะ

import sys
from PyQt5.QtWidgets import *

if __name__ == "__main__":

    app = QApplication([])
    w = QWidget()
    w.setWindowTitle("Musketeers")

    btn1 = QPushButton("Athos")
    btn2 = QPushButton("Porthos")
    btn3 = QPushButton("Aramis")

    hbox = QHBoxLayout(w)

    hbox.addWidget(btn1)
    hbox.addWidget(btn2)
    hbox.addWidget(btn3)

    w.show()

    sys.exit(app.exec_())

และนี่คือลักษณะที่พวกเขาจะดูใน QVBoxแบบ

import sys
from PyQt5.QtWidgets import *

if __name__ == "__main__":

    app = QApplication([])
    w = QWidget()
    w.setWindowTitle("Musketeers")

    btn1 = QPushButton("Athos")
    btn2 = QPushButton("Porthos")
    btn3 = QPushButton("Aramis")

    vb = QVBoxLayout(w)

    vb.addWidget(btn1)
    vb.addWidget(btn2)
    vb.addWidget(btn3)

    w.show()

    sys.exit(app.exec_())

ฟังก์ชันเดียวที่ต้องการคำอธิบายในตอนนี้คือเมธอด addWidget() ใช้ในการแทรกวิดเจ็ตในรูปแบบ HBox หรือ VBox เค้าโครง นอกจากนี้ยังใช้ในเค้าโครงอื่นๆ ที่ใช้พารามิเตอร์จำนวนต่างกันดังที่คุณจะเห็นในส่วนถัดไป วิดเจ็ตจะปรากฏภายในเค้าโครงตามลำดับที่คุณแทรก

QGridLayout

QGridLayout ใช้เพื่อสร้างอินเทอร์เฟซที่มีการวางวิดเจ็ตในรูปแบบของตาราง (เช่นเมทริกซ์หรืออาร์เรย์ 2D) หากต้องการแทรกองค์ประกอบในเค้าโครงตาราง คุณสามารถใช้การแสดงเมทริกซ์เพื่อกำหนดจำนวนแถวและคอลัมน์ในตารางตลอดจนตำแหน่งขององค์ประกอบเหล่านั้น

ตัวอย่างเช่น หากต้องการสร้างตาราง 3*3 (กล่าวคือ ตารางที่มี XNUMX แถวและ XNUMX คอลัมน์) คุณจะต้องเขียนโค้ดดังต่อไปนี้:

Import sys
from PyQt5.QtWidgets import *

if __name__ == "__main__":
    app = QApplication([])

    w = QWidget()

    grid = QGridLayout(w)

    for i in range(3):
        for j in range(3):
            grid.addWidget(QPushButton("Button"),i,j)


    w.show()
    sys.exit(app.exec_())

นี่จะเป็นผลลัพธ์:

เมธอด addWidget() ในเลย์เอาต์แบบตารางรับอาร์กิวเมนต์ดังต่อไปนี้:

• วัตถุวิดเจ็ตที่คุณต้องการเพิ่มลงในตาราง
• พิกัด x ของวัตถุ
• พิกัด y ของวัตถุ
• ขอบเขตแถว (ค่าเริ่มต้น = 0)
• ค่า col-span (ค่าเริ่มต้น = 0)

เพื่อให้เข้าใจได้ดียิ่งขึ้น คุณสามารถแทรกวิดเจ็ตแต่ละชิ้นด้วยตนเองดังที่แสดงด้านล่าง

import sys
from PyQt5.QtWidgets import *

if __name__ == "__main__":
    app = QApplication([])

    w = QWidget()

    grid = QGridLayout(w)
    grid.addWidget(QPushButton("Button one"),0,0)
    grid.addWidget(QPushButton("Button two"),0,1)
    grid.addWidget(QPushButton("Button three"),1,0)
    grid.addWidget(QPushButton("Button four"),1,1)


    w.show()
    sys.exit(app.exec_())

นี่คือลักษณะของตาราง:

คุณยังสามารถส่งพารามิเตอร์ rowspan และ colspan ไปที่ addWidget() เพื่อขยายมากกว่าหนึ่งแถวหรือคอลัมน์ได้

ตัวอย่างเช่น

grid.addWidget(QPushButton("Button five"),2,0,1,0)

ซึ่งจะสร้างปุ่มที่ขยายออกไปทั้งสองคอลัมน์

ธีม

PyQt5 มาพร้อมกับธีมในตัวที่คุณสามารถใช้ในแอปของคุณได้ ที่ เซ็ตสไตล์() วิธีการที่ถูกเรียกบนอินสแตนซ์ QApplication ใช้เพื่อตั้งค่าธีมเฉพาะให้กับแอปพลิเคชันของคุณ

ตัวอย่างเช่น การเพิ่มโค้ดบรรทัดต่อไปนี้จะเปลี่ยนธีมของแอปพลิเคชันของคุณจากค่าเริ่มต้นเป็นธีม Fusion

app.setStyle("Fusion")

ตัวอย่างก่อนหน้านี้จะมีลักษณะดังนี้ในธีม Fusion

อีกหนึ่งฟังก์ชันที่มีประโยชน์สำหรับการปรับแต่งธีมแอปของคุณคือเมธอด setPalette() ต่อไปนี้คือโค้ดสำหรับการเปลี่ยนสีของวิดเจ็ตต่างๆ โดยใช้ setPalette()

import sys
from PyQt5.QtCore import Qt
from PyQt5.QtWidgets import *
from PyQt5.QtGui import QPalette

if __name__ == "__main__":
    app = QApplication([])
    app.setStyle("Fusion")
    
    qp = QPalette()
    qp.setColor(QPalette.ButtonText, Qt.black)
    qp.setColor(QPalette.Window, Qt.black)
    qp.setColor(QPalette.Button, Qt.gray)
    app.setPalette(qp)

    w = QWidget()

    grid = QGridLayout(w)
    grid.addWidget(QPushButton("Button one"),0,0)
    grid.addWidget(QPushButton("Button two"),0,1)
    grid.addWidget(QPushButton("Button three"),1,0)
    grid.addWidget(QPushButton("Button four"),1,1)


    w.show()
    sys.exit(app.exec_())

นี่คือผลลัพธ์

หากต้องการใช้เมธอด setPalette() คุณต้องกำหนดพาเล็ตก่อน ทำได้โดยการสร้างอ็อบเจ็กต์ของคลาส QPalette

 qp = QPalette()

โปรดสังเกตว่าคลาส QPalette เป็นส่วนหนึ่งของโมดูล QtGui และคุณจะต้องนำเข้าโมดูลนี้ก่อนจึงจะใช้งานได้ เมื่อคุณสร้างอ็อบเจ็กต์ QPalette แล้ว ให้ใช้เมธอด setColor() เพื่อส่งชื่อของวิดเจ็ตที่คุณต้องการเปลี่ยนสีและสีที่คุณต้องการตั้งค่า

 qp.setColor(QPalette.Window, Qt.black)

การทำเช่นนี้จะเปลี่ยนสีของหน้าต่างเป็นสีดำ หลังจากที่คุณกำหนดโทนสีแล้ว ให้ใช้ฟังก์ชัน setPalette() เพื่อใช้โทนสีนั้นกับแอปพลิเคชันของคุณ

app.setPalette(qp)

นั่นคือทั้งหมดที่คุณต้องทำหากคุณต้องการสร้างธีมพื้นฐานสำหรับแอปของคุณ PyQt ยังอนุญาตให้คุณใช้สไตล์ชีทเพื่อกำหนดรูปลักษณ์ของวิดเจ็ตของคุณ หากคุณคุ้นเคยกับ CSS คุณสามารถกำหนดสไตล์ขั้นสูงสำหรับแอปของคุณได้อย่างง่ายดายโดยใช้ Qt Style Sheets

คำถามที่พบบ่อย