用 PyQt 打造具有專業外觀的 GUI
快速創建表單：QFormLayout
QFormLayout適合您。此類將小部件布置為兩列布局。第一列通常顯示描述預期輸入的標簽，第二列通常包含允許用戶輸入或編輯數據的輸入小部件，例如QLineEdit，QComboBox或QSpinBox。.addRow（）。此方法有多種變量，但是在大多數情況下，您可以從以下兩種進行選擇：-
.addRow（label，field）將新行添加到表單布局的底部。該行應包含一個QLabel對象（label）和一個輸入小部件（field)）。 -
.addRow（labelText，field）自動創建并添加帶有labelText作為其文本的新QLabel對象。字段. field包含一個輸入小部件。
QFormLayout對象排列小部件的示例應用程序：import?sys
from?PyQt5.QtWidgets?import?(
????QApplication,
????QFormLayout,
????QLabel,
????QLineEdit,
????QWidget,
)
class?Window(QWidget):
????def?__init__(self):
????????super().__init__()
????????self.setWindowTitle("QFormLayout?Example")
????????self.resize(270,?110)
????????#?Create?a?QHBoxLayout?instance
????????layout?=?QFormLayout()
????????#?Add?widgets?to?the?layout
????????layout.addRow("Name:",?QLineEdit())
????????layout.addRow("Job:",?QLineEdit())
????????emailLabel?=?QLabel("Email:")
????????layout.addRow(emailLabel,?QLineEdit())
????????#?Set?the?layout?on?the?application's?window
????????self.setLayout(layout)
if?__name__?==?"__main__":
????app?=?QApplication(sys.argv)
????window?=?Window()
????window.show()
????sys.exit(app.exec_())
QFormLayout對象。然后，在第19至22行上，向布局中添加一些行。請注意，在第19行和第20行，您使用方法的第二個變量，在第22行，您使用第一個變量，將QLabel對象作為第一個參數傳遞給.addRow（）。
QFormLayout，可以以兩列的方式組織小部件。第一列包含標簽，要求用戶提供一些信息。第二列顯示允許用戶輸入或編輯該信息的小部件。.addLayout（）。這樣，內部布局成為外部布局的子級。
import?sys
from?PyQt5.QtWidgets?import?(
????QApplication,
????QCheckBox,
????QFormLayout,
????QLineEdit,
????QVBoxLayout,
????QWidget,
)
class?Window(QWidget):
????def?__init__(self):
????????super().__init__()
????????self.setWindowTitle("Nested?Layouts?Example")
????????#?Create?an?outer?layout
????????outerLayout?=?QVBoxLayout()
????????#?Create?a?form?layout?for?the?label?and?line?edit
????????topLayout?=?QFormLayout()
????????#?Add?a?label?and?a?line?edit?to?the?form?layout
????????topLayout.addRow("Some?Text:",?QLineEdit())
????????#?Create?a?layout?for?the?checkboxes
????????optionsLayout?=?QVBoxLayout()
????????#?Add?some?checkboxes?to?the?layout
????????optionsLayout.addWidget(QCheckBox("Option?one"))
????????optionsLayout.addWidget(QCheckBox("Option?two"))
????????optionsLayout.addWidget(QCheckBox("Option?three"))
????????#?Nest?the?inner?layouts?into?the?outer?layout
????????outerLayout.addLayout(topLayout)
????????outerLayout.addLayout(optionsLayout)
????????#?Set?the?window's?main?layout
????????self.setLayout(outerLayout)
if?__name__?==?"__main__":
????app?=?QApplication(sys.argv)
????window?=?Window()
????window.show()
????sys.exit(app.exec_())
-
在第17行，您將創建外部或頂層布局，將其用作父布局和窗口的主布局。在這種情況下，使用 QVBoxLayout是因為您希望將小部件垂直排列在窗體上。在您的模型中，這是藍色布局。 -
在第19行，您創建一個表單布局來保存標簽和行編輯。 -
在第21行，將所需的小部件添加到布局中。這等效于您的綠色布局。 -
在第23行，您將創建一個垂直布局來容納復選框。 -
在第25至27行上，添加所需的復選框。這是您的紅色布局。 -
在第29和30行上，將 topLayout和optionsLayout嵌套在outsideLayout下。
.addWidget（）。這會將每個小部件添加到布局內部小部件列表的末尾。您還可以分別使用.insertWidget（index）或.removeWidget（widget）在小部件列表中的給定位置插入或刪除小部件。.count（）。.setCurrentIndex（）。import?sys
from?PyQt5.QtWidgets?import?(
????QApplication,
????QComboBox,
????QFormLayout,
????QLineEdit,
????QStackedLayout,
????QVBoxLayout,
????QWidget,
)
class?Window(QWidget):
????def?__init__(self):
????????super().__init__()
????????self.setWindowTitle("QStackedLayout?Example")
????????#?Create?a?top-level?layout
????????layout?=?QVBoxLayout()
????????self.setLayout(layout)
????????#?Create?and?connect?the?combo?box?to?switch?between?pages
????????self.pageCombo?=?QComboBox()
????????self.pageCombo.addItems(["Page?1",?"Page?2"])
????????self.pageCombo.activated.connect(self.switchPage)
????????#?Create?the?stacked?layout
????????self.stackedLayout?=?QStackedLayout()
????????#?Create?the?first?page
????????self.page1?=?QWidget()
????????self.page1Layout?=?QFormLayout()
????????self.page1Layout.addRow("Name:",?QLineEdit())
????????self.page1Layout.addRow("Address:",?QLineEdit())
????????self.page1.setLayout(self.page1Layout)
????????self.stackedLayout.addWidget(self.page1)
????????#?Create?the?second?page
????????self.page2?=?QWidget()
????????self.page2Layout?=?QFormLayout()
????????self.page2Layout.addRow("Job:",?QLineEdit())
????????self.page2Layout.addRow("Department:",?QLineEdit())
????????self.page2.setLayout(self.page2Layout)
????????self.stackedLayout.addWidget(self.page2)
????????#?Add?the?combo?box?and?the?stacked?layout?to?the?top-level?layout
????????layout.addWidget(self.pageCombo)
????????layout.addLayout(self.stackedLayout)
????def?switchPage(self):
????????self.stackedLayout.setCurrentIndex(self.pageCombo.currentIndex())
if?__name__?==?"__main__":
????app?=?QApplication(sys.argv)
????window?=?Window()
????window.show()
????sys.exit(app.exec_())
QComboBox對象，該對象將允許您在布局中的頁面之間進行切換。然后，在列表的組合框中添加兩個選項，并將其連接到旨在處理頁面切換的.switchPage（）。.switchPage（）內部，您在布局對象上調用.setCurrentIndex（），將組合框的當前索引作為參數傳遞。這樣，當用戶更改組合框中的選項時，堆疊版式上的頁面將相應地更改。QStackedLayout對象。在第27至32行上，將第一頁添加到布局中，在第34至39行上，將第二頁添加到布局中。每個頁面都由一個QWidget對象表示，該對象以方便的布局包含多個小部件。
QWidget對象表示。當您在窗口頂部的組合框中選擇一個新頁面時，布局將更改以顯示所選頁面。QTabWidget創建多頁用戶界面。您將在下一節中學習如何操作。QTabWidget的類。此類提供標簽欄和頁面區域。您可以使用選項卡欄在頁面之間切換，并使用頁面區域顯示與所選選項卡關聯的頁面。.setTabPosition（）和四個可能的選項卡位置之一來更改此行為：
.addTab（）。此方法有兩個變量或重載的實現：.addTab(page, label).addTab(page, icon, label)label為標簽標題。. page必須是一個小部件，代表與手邊的選項卡關聯的頁面。QIcon對象。如果您將圖標傳遞給.addTab（），則該圖標將顯示在標簽標題的左側。QWidget對象。這樣，您就可以使用包含所需窗口小部件的布局向頁面添加額外的窗口小部件。QTabWidget對象的基礎知識：import?sys
from?PyQt5.QtWidgets?import?(
????QApplication,
????QCheckBox,
????QTabWidget,
????QVBoxLayout,
????QWidget,
)
class?Window(QWidget):
????def?__init__(self):
????????super().__init__()
????????self.setWindowTitle("QTabWidget?Example")
????????self.resize(270,?110)
????????#?Create?a?top-level?layout
????????layout?=?QVBoxLayout()
????????self.setLayout(layout)
????????#?Create?the?tab?widget?with?two?tabs
????????tabs?=?QTabWidget()
????????tabs.addTab(self.generalTabUI(),?"General")
????????tabs.addTab(self.networkTabUI(),?"Network")
????????layout.addWidget(tabs)
????def?generalTabUI(self):
????????"""Create?the?General?page?UI."""
????????generalTab?=?QWidget()
????????layout?=?QVBoxLayout()
????????layout.addWidget(QCheckBox("General?Option?1"))
????????layout.addWidget(QCheckBox("General?Option?2"))
????????generalTab.setLayout(layout)
????????return?generalTab
????def?networkTabUI(self):
????????"""Create?the?Network?page?UI."""
????????networkTab?=?QWidget()
????????layout?=?QVBoxLayout()
????????layout.addWidget(QCheckBox("Network?Option?1"))
????????layout.addWidget(QCheckBox("Network?Option?2"))
????????networkTab.setLayout(layout)
????????return?networkTab
if?__name__?==?"__main__":
????app?=?QApplication(sys.argv)
????window?=?Window()
????window.show()
????sys.exit(app.exec_())
QTabWidget對象。然后，使用.addTab（）將兩個選項卡添加到選項卡小部件。.generalTabUI（）和networkTabUI（）中，為每個選項卡創建特定的GUI。為此，您可以使用QWidget對象，QVBoxLayout對象和一些復選框來保存選項。