Create GUI Application with Python Qt6

Basic

• qt

  • QApplication

    • 维护了一个event loop

  • QWidget

    • 可以使用layouts任意组合形成复杂ui

  • QMainWindow

    • 预设的组件,提供了一些特性

      • toolbar, menu, status bar, dockable widget..

  • 练习1

  • signal/slots

    • 很多组件都有public slots, 可以直接和其他信号连接

      • 数据类型要对的上?

  • 组件

    • 对齐

      • Qt.AlignmentFlag.Align*

    • QLabel

      • 显式图片

        • .setPixmap(QPixmap("xxx.jpg"))

    • QCheckBox

      • 信号

        • .stateChanged.connect(..)

    • QComboBox

      • .addItems([])

      • 信号

        • `.currentIndexChanged.connect(..)

        • .currentTextChanged.connect(..)

    • QListWidget

      • .addItems([])

      • 信号

        • .currentItemChanged.connect(..)

          • def item_changed(item)

        • .currentTextChanged.connect(..)

          • def text_changed(string)

    • QLineEdit

      • .setInputMask('000.0000.000.000;'

  • 布局

    • QHBoxLayout

    • QVBoxLayout

    • QGridLayout

    • QStackedLayout

  • Actions/Toolbars/Menus

    • toolbar

      • 元素

        • 图标/文本/任意Qt widget

练习

1 概念熟悉

import sys
from PySide6.QtCore import QSize, Qt
from PySide6.QtWidgets import QApplication, QMainWindow, QPushButton

class MainWindow(QMainWindow):
    def __init__(self):
        super().__init__()

        self.setWindowTitle("ex-1")
        btn = QPushButton("Press Me!")
        self.setCentralWidget(btn)
		self.setFixedSize(QSize(400, 400))

app = QApplication(sys.argv)
win = MainWindow()
win.show()
sys.exit(app.exec())

![[Pasted image 20220406013205.png]]

2. 布局/signal初试

class MainWindow(QMainWindow):
    def __init__(self):
        super().__init__()
        self.setWindowTitle("ex-2")
        self.label = QLabel()
        self.input = QLineEdit()
        self.input.textChanged.connect(self.label.setText)
        vbox = QVBoxLayout()
        vbox.addWidget(self.input)
        vbox.addWidget(self.label)
        container = QWidget()
        container.setLayout(vbox)
        self.setCentralWidget(container)

![[Pasted image 20220406014236.png]]

3. 布局

class MainWindow(QMainWindow):
    def __init__(self):
        super().__init__()

        # 纵向布局
        vl = QVBoxLayout()
        vl.addWidget(Color("red"))
        vl.addWidget(Color("green"))
        vl.addWidget(Color("blue"))

        # 横向布局
        hl = QHBoxLayout()
        hl.addWidget(Color("red"))
        hl.addWidget(Color("green"))
        hl.addWidget(Color("blue"))

        # 嵌套布局
        l1 = QHBoxLayout()
        l2 = QVBoxLayout()
        l3 = QVBoxLayout()

        l2.addWidget(Color("red"))
        l2.addWidget(Color("yellow"))
        l2.addWidget(Color("purple"))

        l1.addLayout(l2)
        l1.addWidget(Color("green"))

        l3.addWidget(Color("red"))
        l3.addWidget(Color("purple"))
        l1.addLayout(l3)

        l1.setContentsMargins(0,0,0,0)
        l1.setSpacing(20)

        # 表格布局
        gl = QGridLayout()
        gl.addWidget(Color("red"), 0, 0)
        gl.addWidget(Color("green"), 1, 0)
        gl.addWidget(Color("blue"), 1, 1)
        gl.addWidget(Color("purple"), 2, 1)

        # 堆栈布局
        sl = QStackedLayout()
        sl.addWidget(Color("red"))
        sl.addWidget(Color("green"))
        sl.addWidget(Color("blue"))
        sl.addWidget(Color("purple"))

        pl = QVBoxLayout()
        bl = QHBoxLayout()
        self.stack_layout = QStackedLayout()

        pl.addLayout(bl)
        pl.addLayout(self.stack_layout)

        btn = QPushButton("red")
        btn.pressed.connect(self.active_tab1)
        bl.addWidget(btn)
        self.stack_layout.addWidget(Color("red"))

        btn = QPushButton("green")
        btn.pressed.connect(self.active_tab2)
        bl.addWidget(btn)
        self.stack_layout.addWidget(Color("green"))

        btn = QPushButton("blue")
        btn.pressed.connect(self.active_tab3)
        bl.addWidget(btn)
        self.stack_layout.addWidget(Color("blue"))

        # tab布局
        tabs = QTabWidget()
        tabs.setTabPosition(QTabWidget.TabPosition.North)
        tabs.setMovable(True)

        for n, color in enumerate(["red", "green", "blue", "yellow"]):
            tabs.addTab(Color(color), color)

        w = QWidget()
        w.setLayout(pl)
        self.setCentralWidget(tabs)
    
    def active_tab1(self):
        self.stack_layout.setCurrentIndex(0)
    
    def active_tab2(self):
        self.stack_layout.setCurrentIndex(1)
    
    def active_tab3(self):
        self.stack_layout.setCurrentIndex(2)