Layout 布局 ( Form 表单 )

这篇教学会介绍如何透过 PyQt6 视窗里的 QFormLayout() 方法，进行元件的 Form 表单布局。

快速导览：

• 建立 Form 表单布局
• 调整排列方式

因为 Google Colab 不支援 PyQt6，所以请使用本机环境 ( 参考：使用 Python 虚拟环境 ) 或使用 Anaconda Jupyter 进行实作 ( 参考：使用 Anaconda )。

建立 Form 网格布局

当 PyQt6 建立视窗后，视窗本身是一个 Widget，因此只要使用 QFormLayout() 方法，就可以在视窗 Widget 上建立 Form 表单布局的“layout”，当 QFormLayout 建立后，默认只会有两个字段，一个是 QLabel 文字，另一个是 QLineEdit 单行输入框或 QPlainTextEdit 多行输入框。

下方的程序码使用 addRow(text, input) 方法在 QFormLayout 中增加内容，执行结果会出现三个“文字 + 输入框”。

from PyQt6 import QtWidgets
import sys
app = QtWidgets.QApplication(sys.argv)

Form = QtWidgets.QWidget()
Form.setWindowTitle('oxxo.studio')
Form.resize(300, 200)

label1 = QtWidgets.QLabel('AAA')
input1 = QtWidgets.QLineEdit(Form)
label2 = QtWidgets.QLabel('BBB')
input2 = QtWidgets.QLineEdit(Form)
label3 = QtWidgets.QLabel('CCC')
input3 = QtWidgets.QPlainTextEdit(Form)

box = QtWidgets.QWidget(Form)          # 建立放置 QFormLayout 的 Widget
box.setGeometry(10,10,200,150)

layout = QtWidgets.QFormLayout(box)    # 建立 QFormLayout
layout.addRow(label1, input1)          # QFormLayout 加入一列，內容為文字 + 輸入框
layout.addRow(label2, input2)          # QFormLayout 加入一列，內容為文字 + 輸入框
layout.addRow(label3, input3)          # QFormLayout 加入一列，內容為文字 + 輸入框

Form.show()
sys.exit(app.exec())

class 的写法：

from PyQt6 import QtWidgets
import sys

class MyWidget(QtWidgets.QWidget):
    def __init__(self):
        super().__init__()
        self.setWindowTitle('oxxo.studio')
        self.resize(300, 200)
        self.ui()

    def ui(self):
        self.label1 = QtWidgets.QLabel('AAA')
        self.input1 = QtWidgets.QLineEdit(self)
        self.label2 = QtWidgets.QLabel('BBB')
        self.input2 = QtWidgets.QLineEdit(self)
        self.label3 = QtWidgets.QLabel('CCC')
        self.input3 = QtWidgets.QPlainTextEdit(self)

        self.box = QtWidgets.QWidget(self)
        self.box.setGeometry(10,10,200,150)

        self.layout = QtWidgets.QFormLayout(self.box)
        self.layout.addRow(self.label1, self.input1)
        self.layout.addRow(self.label2, self.input2)
        self.layout.addRow(self.label3, self.input3)

if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    Form = MyWidget()
    Form.show()
    sys.exit(app.exec())

调整排列方式

QFormLayout 提供三种排列方式，可以设定文字与输入框的位置 ( 用法和 PyQt5 相同，但名称不同 )：

延伸上面的程序码，透过不同方法，设定出不同的排列方式。

layout.setRowWrapPolicy(QtWidgets.QFormLayout.RowWrapPolicy.DontWrapRows)

layout.setRowWrapPolicy(QtWidgets.QFormLayout.RowWrapPolicy.WrapLongRows)

layout.setRowWrapPolicy(QtWidgets.QFormLayout.RowWrapPolicy.WrapAllRows)

意见反馈