Python Qt GUI設計：QTabWidget、QStackedWidget和QDockWidget容器控件類（提升篇—2）

目錄

1、QTabWidget容器控件類

2、QStackedWidget容器控件類

3、QDockWidget容器控件類

有時候我們可能會面臨這樣一種情況：所開發的程式包含了太多的控件，導緻一個視窗裝載不下或者裝載的控件太多而不美觀。

本篇博文就來解決這個問題，即如何在現有的視窗空間中裝載更多的控件。

QTabWidget控件提供了一個頁籤和一個頁面區域，預設顯示第一個頁籤的頁面。通過單擊各頁籤可以檢視對應的頁面。如果在一個視窗中顯示的輸入字段很多，則可以對這些字段進行拆分，分别放置在不同頁面的頁籤中。

QTabWidget類中的常用方法如下表所示：

QTabWidget類中的常用信号如下表所示：

通過示例，了解QTabWidget容器控件類的使用方法，效果如下所示：

示例中，一個表單的内容分為三組，每一組小控件都顯示在不同的頁籤中。頂層視窗是一個QTablWidget控件，将三個頁籤添加進去。

實作代碼如下所示：

import sys
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
         
class TabDemo(QTabWidget):
    def __init__(self, parent=None):
  super(TabDemo, self).__init__(parent)   
  self.tab1 = QWidget()
  self.tab2 = QWidget()
  self.tab3 = QWidget()
  self.addTab(self.tab1,"Tab 1")
  self.addTab(self.tab2,"Tab 2")
  self.addTab(self.tab3,"Tab 3")
  self.tab1UI()
  self.tab2UI()
  self.tab3UI()
  self.setWindowTitle("Tab 例子")
 
    def tab1UI(self):
  layout = QFormLayout()
  layout.addRow("姓名",QLineEdit())
  layout.addRow("位址",QLineEdit())
  self.setTabText(0,"聯系方式")
  self.tab1.setLayout(layout)
 
    def tab2UI(self):
  layout = QFormLayout()
  sex = QHBoxLayout()
  sex.addWidget(QRadioButton("男"))    
  sex.addWidget(QRadioButton("女"))
  layout.addRow(QLabel("性别"),sex)
  layout.addRow("生日",QLineEdit())
  self.setTabText(1,"個人詳細資訊")
  self.tab2.setLayout(layout)
 
    def tab3UI(self):
  layout=QHBoxLayout()
  layout.addWidget(QLabel("科目"))
  layout.addWidget(QCheckBox("實體"))
  layout.addWidget(QCheckBox("高數"))
  self.setTabText(2,"教育程度")
  self.tab3.setLayout(layout)
if __name__ == '__main__':
    app = QApplication(sys.argv)
    demo = TabDemo()
    demo.show()
    sys.exit(app.exec_())      

QStackedWidget是一個堆棧視窗控件，使用QStackedLayout布局，可以填充一些小控件，但同一時間隻有一個小控件可以顯示。QStackedWidget控件與QTabWidget類似，可以有效地顯示視窗中的控件。

通過示例，了解QStackedWidget容器控件類的使用方法，效果如下所示：

示例中，在QStackedWidget對象中填充了三個子控件。每個子控件都可以有自己的布局，包含特定的表單元素。QStackedWidget控件不能在頁面之間切換，它與目前選中的QListWidget控件中的選項進行連接配接。将QListWidget的currentRowChanged信号與display()槽函數相關聯，進而改變堆疊控件的視圖。

import sys
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
   
class StackedExample(QWidget):
    def __init__(self):
  super(StackedExample, self).__init__()
  self.setGeometry(300, 50, 10,10)
  self.setWindowTitle('StackedWidget 例子')
 
  self.leftlist = QListWidget ()
  self.leftlist.insertItem (0, '聯系方式' )
  self.leftlist.insertItem (1, '個人資訊' )
  self.leftlist.insertItem (2, '教育程度' )
  self.stack1= QWidget()
  self.stack2= QWidget()
  self.stack3= QWidget()
  self.stack1UI()
  self.stack2UI()
  self.stack3UI()
  self.Stack = QStackedWidget (self)
  self.Stack.addWidget (self.stack1)
  self.Stack.addWidget (self.stack2)
  self.Stack.addWidget (self.stack3)
  hbox = QHBoxLayout(self)
  hbox.addWidget(self.leftlist)
  hbox.addWidget(self.Stack)
  self.setLayout(hbox)
  self.leftlist.currentRowChanged.connect(self.display)
    def stack1UI(self):
  layout=QFormLayout()
  layout.addRow("姓名",QLineEdit())
  layout.addRow("位址",QLineEdit())
  self.stack1.setLayout(layout)
    def stack2UI(self):
  layout=QFormLayout()
  sex=QHBoxLayout()
  sex.addWidget(QRadioButton("男"))
  sex.addWidget(QRadioButton("女"))
  layout.addRow(QLabel("性别"),sex)
  layout.addRow("生日",QLineEdit())   
  self.stack2.setLayout(layout)
    def stack3UI(self):
  layout=QHBoxLayout()
  layout.addWidget(QLabel("科目"))
  layout.addWidget(QCheckBox("實體"))
  layout.addWidget(QCheckBox("高數"))
  self.stack3.setLayout(layout)
    def display(self,i):
  self.Stack.setCurrentIndex(i)
                 
if __name__ == '__main__':
    app = QApplication(sys.argv)
    demo = StackedExample()
    demo.show()
    sys.exit(app.exec_())      

QDockWidget是一個可以停靠在QMainWindow内的視窗控件，它可以保持在浮動狀态或者在指定位置作為子視窗附加到主視窗中。QMainWindow類的主視窗對象保留有一個用于停靠視窗的區域，這個區域在控件的中央周圍，如下圖所示：

QDockWidget控件在主視窗内可以移動到新的區域。QDockWidget類中的常用方法如下表所示：

通過示例，了解QDockWidget容器控件類的使用方法，效果如下所示：

示例中，頂層視窗是一個QMainWindow對象，QTextEdit對象是它的中央小控件，建立可停靠的視窗items，然後，在停靠視窗items内添加QListWidget對象，最後，将停靠視窗放置在中央小控件的右側。

import sys
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
class DockDemo(QMainWindow):
    def __init__(self, parent=None):
  super(DockDemo, self).__init__(parent)
  layout = QHBoxLayout()
  bar=self.menuBar()
  file=bar.addMenu("File")
  file.addAction("New")
  file.addAction("save")
  file.addAction("quit")
  self.items = QDockWidget("Dockable", self)
  self.listWidget = QListWidget()
  self.listWidget.addItem("item1")
  self.listWidget.addItem("item2")
  self.listWidget.addItem("item3")
  self.items.setWidget(self.listWidget)
  self.items.setFloating(False)
  self.setCentralWidget(QTextEdit())
  self.addDockWidget(Qt.RightDockWidgetArea, self.items)
  self.setLayout(layout)
  self.setWindowTitle("Dock 例子")
    
if __name__ == '__main__':
    app = QApplication(sys.argv)
    demo = DockDemo()
    demo.show()
    sys.exit(app.exec_())