PyQt5快速开发与实战

5. 第5章 PyQt5 高级界面控件

5.2 容器：装载更多的控件

如何在现有的窗口空间中装载更多的控件。

5.2.1 QTabWidget

QTabWidget控件提供了一个选项卡和一个页面区域，默认显示第一个选项卡的页面。通过单击各选项卡可以查看对应的页面。如果在一个窗口中显示的输入字段很多，则可以对这些字段进行拆分，分别放置在不同页面的选项卡中。

QTabWidget类中的常用方法

方法	描述
addTab()	将一个控件添加到Tab控件的选项卡中
insertTab()	将一个 Tab控件的选项卡插入到指定的位置
removeTab()	根据指定的索引剧除Tab控件
setCurrentIndex()	设置当前可见的选项卡所在的索引
setCurrentWidget()	设置当前可见的页面
setTabBar()	设置选项卡栏的小控件
setTabPosition()	设置选项卡的位置:QTabWidgct.North，显示在页面的上方；QTabWidget.South，显示在页面的下方；QTabWidget.West，显示在页面的左侧；QTabWidget.East，显示在页面的右侧
setTabText()	定义Tab选项卡的显示值

QTabWidget类中的常用信号

信号	描述
currentChanged	切换当前页面时发射该信号

案例——QTabWidget的使用

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__':from pyqt5_plugins.examples.exampleqmlitem import QtCoreQtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)app = QApplication(sys.argv)win = TabDemo()win.show()sys.exit(app.exec_())

5.2.2 QStackedWidget

QStackedWidget是一个堆栈窗口控件，可以填充一些小控件，但同一时间只有一个小控件可以显示。OStackedWidget使用QStackedLayout布局。QStackedWidget控件与QTabWidget类似,可以有效地显示窗口中的控件。

案例——QTabWidget的使用

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__':from pyqt5_plugins.examples.exampleqmlitem import QtCoreQtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)app = QApplication(sys.argv)win = StackedExample()win.show()sys.exit(app.exec_())

5.2.3 QDockWidget

QDock Widget是一个可以停靠在QMainWindow内的窗口控件，它可以保持在浮动状态或者在指定位置作为子窗口附加到主窗口中。QMainWindow类的主窗口对象保留有一个用于停靠窗口的区域，这个区域在控件的中央周围。

QDockWidget控件在主窗口内可以移动到新的区域。

QDockWidget类中的常用方法：

方法	描述
setWidget()	在 Dock窗口区域设置QWidget
setFloating()	设置Dock窗口是否可以浮动，如果设置为True，则表示可以浮动
setAllowedAreas()	设置窗口可以停靠的区域;LeftDockWidget.Area，左边停靠区域；RightDockWidgetArea，右边停靠区域；TopDockWidgetArea，顶部停靠区域；BottomDockWidgetArea，底部停靠区域；NoDockWidgetArea，不显示Widget；
setFeatures()	设置停靠窗口的功能属性;DockWidgetClosable，可关闭；DockWidgetMovable,可移动；DockWidgetFloatable，可漂浮；DockWidget VerticalTitleBar，在左边显示垂直的标签栏；AllDockWidgetFeatures，具有前三种属性的所有功能；NoDockWidgetFeatures，无法关闭,不能移动,不能漂浮；

案例——QDockWidget的使用

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__':from pyqt5_plugins.examples.exampleqmlitem import QtCoreQtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)app = QApplication(sys.argv)win = DockDemo()win.show()sys.exit(app.exec_())

5.2.4 多文档界面

一个典型的 GUI应用程序可能有多个窗口，选项卡控件和堆栈窗口控件允许一次使用其中的一个窗口。然而，很多时候这种方法不是很有用，因为其他窗口的视图是隐藏的。

一种同时显示多个窗口的方法是，创建多个独立的窗口，这些独立的窗口被称为SDI (Single Document Interface，单文档界面)，每个窗口都可以有自己的菜单系统、工具栏等。这需要占用较多的内存资源。

MDI (Multiple Document Interface，多文档界面）应用程序占用较少的内存资源，子窗口都可以放在主窗口容器中，这个容器控件被称为QMdiArea。

QMidArea控件通常占据在QMainWindow对象的中央位置，子窗口在这个区域是QMdiSubWindow类的实例，可以设置任何QWidget作为子窗口对象的内部控件，子窗口在MDI 区域进行级联排列布局。

QMdiArea类和QMdiSubWindow类中的常用方法：

方法	描述
addSubWindow()	将一个小控件添加在MDI区域作为一个新的子窗口
removeSubWindow()	删除一个子窗口中的小控件
setActiveSubWindow()	激活一个子窗口
cascadeSubWindow()	安排子窗口在MDI区域级联显示
tileSubWindows()	安排子窗口在MDI区域平铺显示
closeActiveSubWindow()	关闭活动的子窗口
subWindowList()	返回MDI 区域的子窗口列表
setWidget()	设置一个小控件作为QMdiSubwindow实例对象的内部控件

案例——多文档界面

import sys
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *class MainWindow(QMainWindow):count = 0def __init__(self, parent=None):super(MainWindow, self).__init__(parent)self.mdi = QMdiArea()self.setCentralWidget(self.mdi)bar = self.menuBar()file = bar.addMenu("File")file.addAction("New")file.addAction("cascade")file.addAction("Tiled")file.triggered[QAction].connect(self.windowaction)self.setWindowTitle("MDI demo")def windowaction(self, q):print("triggered")if q.text() == "New":MainWindow.count = MainWindow.count + 1sub = QMdiSubWindow()sub.setWidget(QTextEdit())sub.setWindowTitle("subwindow" + str(MainWindow.count))self.mdi.addSubWindow(sub)sub.show()if q.text() == "cascade":self.mdi.cascadeSubWindows()if q.text() == "Tiled":self.mdi.tileSubWindows()if __name__ == '__main__':from pyqt5_plugins.examples.exampleqmlitem import QtCoreQtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)app = QApplication(sys.argv)win = MainWindow()win.show()sys.exit(app.exec_())

5.2.5 QScrollBar

可以看到，前面几个窗口控件的共同点是新建一些窗口来装载更多的控件，而QScrollBar提供了另一种思路:这个窗口控件提供了水平的或垂直的滚动条，这样可以扩大当前窗口的有效装载面积，从而装载更多的控件。

QScrollBar类中的常用信号：

信号	含义
valueChanged	当滑动条的值改变时发射此信号
sliderMoved	当用户拖动滑块时发射此信号

案例——QScrollBar

import sys
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *class Example(QWidget):def __init__(self):super(Example, self).__init__()self.initUI()def initUI(self):hbox = QHBoxLayout()self.l1 = QLabel("拖动滑动条去改变颜色")self.l1.setFont(QFont("Arial", 16))hbox.addWidget(self.l1)self.s1 = QScrollBar()self.s1.setMaximum(255)self.s1.sliderMoved.connect(self.sliderval)self.s2 = QScrollBar()self.s2.setMaximum(255)self.s2.sliderMoved.connect(self.sliderval)self.s3 = QScrollBar()self.s3.setMaximum(255)self.s3.sliderMoved.connect(self.sliderval)hbox.addWidget(self.s1)hbox.addWidget(self.s2)hbox.addWidget(self.s3)self.setGeometry(300, 300, 300, 200)self.setWindowTitle('QScrollBar 例子')self.setLayout(hbox)def sliderval(self):print(self.s1.value(), self.s2.value(), self.s3.value())palette = QPalette()c = QColor(self.s1.value(), self.s2.value(), self.s3.value(), 255)palette.setColor(QPalette.Foreground, c)self.l1.setPalette(palette)if __name__ == '__main__':from pyqt5_plugins.examples.exampleqmlitem import QtCoreQtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)app = QApplication(sys.argv)win = Example()win.show()sys.exit(app.exec_())