本系列面向Python的现实茶，应用QtDesigner从零开始实战解说PyQt5的项目实战。
在软件项目中，为了适应不同的任务场景，往往需要各种各样的图形界面。 选项卡控件(QTackedWidget )通过选项卡选择打开相应的对话框页面，无需单独编程。 堆栈控件(QStackedWidget )控制主程序中由编程显示的图形界面，虽然相对复杂，但更通用、更灵活。
本文以堆栈窗口控件为例，详细介绍了堆栈布局的界面设计和程序实现过程，并通过案例加入实际倒茶制作典型的堆栈布局多窗口开关。
欢迎关注『Python 真实的嚓茶从零开始 PyQt5 项目实战 @ Youcans』系列，持续更新中
Python从零真茶开始的PyQt5项目实战(1)设置与环境布局
Python从零真茶开始的PyQt5项目实战(2)菜单和工具栏
Python从真茶零开始的PyQt5项目实战(3)信号与油箱的连接
Python现实的零茶到PyQt5项目实战(4)基本控制
Python现实的零茶到PyQt5项目实战(5)布局管理
Python真茶从零开始的PyQt5项目实战(6)窗口切换的堆栈布局
Python从零真茶开始的PyQt5项目实战(7)实现侧围折叠
1 .堆栈布局概述1 .“堆栈布局”(Stacked Layout )布局管理是指管理图形窗口中每个零件的位置和放置。 图形窗口中的许多部件也必须通过布局管理来组织、分组和放置部件，以方便界面的使用。 上一篇文章介绍了基本的水平布局、垂直布局、网格布局、表格布局、高级嵌套布局和容器布局。
在容器布局中，通过容器控制Containers和布局管理器Layouts的组合，可以分割和布局程序窗口，可以自由设计各种丰富的图形界面。
在实际的软件项目中，为了适应不同的任务场景，往往需要多个不同的图形界面。 如何实现多窗口图形界面的需求？ 粗略地说，有几种想法：
使用弹出窗口。 主窗口提供基本界面，通过弹出窗口实现子任务界面，子任务完成后关闭弹出窗口返回主窗口。
这是一个可行、比较简单的处理方案，很多APP应用程序中都有弹出窗口。 但是，经常打开和关闭窗口的用户体验不好。 另外，窗口之间的切换不方便。
重新构建图形界面。 调用新的图形界面时，请在关闭后删除现有界面上的所有控件，并创建所需的新控件。
虽然该方案可行，但由于编程复杂、浪费资源、容易出错、难以适应多窗口相互切换的要求，因此很少使用。 QtDesigner也不支持使用此方案。
通过堆栈布局切换多窗口。 堆栈布局是在窗口的整个或部分区域中设置多个图形界面，并根据需要使用指定的图形界面。
例如，在戏剧和摄影中准备了多个背景幕布，需要什么样的场景就像把需要的场景幕布展开，收起其他幕布一样。
1.2堆栈布局的实现方法QStackedLayout类提供多页切换的堆栈布局。
选项卡控件(QTackedWidget )包含一个选项卡对话框，其外观类似于浏览器页面打开多个选项卡页。 选项卡控件允许您创建具有自己选项卡的多个对话框页。 使用时单击选项卡行将其选中，将打开相应的对话框页面，无需单独编程。
“堆栈控件”(QStackedWidget )提供了更通用、更灵活的多窗口、多页面切换解决方案。 可以将QStackedWidget控件添加到整个窗口或窗口中的任何区域，可以在堆栈窗口区域中设计多个页面，也可以使用程序控件中指定的窗口界面。
堆栈控件(QStackedWidget )需要控制主程序中由编程显示的图形界面，与选项卡控件(QTackedWidget )相比更复杂，但也更复杂
本文以堆栈窗口控件(QStackedWidget )为例，详细介绍堆栈布局的界面设计和程序实现过程。
2 .多窗口切换栈布局的创建(1)以上述uiDemo6.ui为基础。 图形窗口的左侧上部是垂直布局的按钮控制区域leftLayout_1，设有用于选择不同业务的多个按钮控制。 左侧下部为垂直布局的文本区域leftLayout_2，设有文本窗格。 )2)将图形窗口右侧的主体区域设计为堆栈窗口，根据各种业务场景设计多个图形界面。 在QtDesigner左侧的工具栏" Containers "类中，选择" Stacked Widget "控件，然后将其拖动到设计的图形窗口中以创建堆栈布局的容器控件。 在窗口中选择堆栈容器堆叠的构件后，可以通过鼠标拖动和拉伸来调整控件的位置和大小，以及在属性编辑器中设定“x，y”、“宽度”和“高度”属性堆栈容器“堆叠的构件”自动创建了两个页面。 将鼠标悬停在堆栈容器" Stacked Widget "上，右键单击以调用下拉菜单，然后选择“插入页面”以插入新页面，或选择“更改页面顺序”以调整每页的顺序。 在控件的右上角显示黑色三角符号，您可以在多个页面之间切换，也可以在对象查看器中选择所需的内容
编辑的页面。 （3）堆叠容器 “Stacked Widget” 中各页面的设计，具体设计内容是根据业务需要确定的。 page_0 的设计：标签控件 label_1 用于显示封面图片，按钮控件 pushButton_6~8 用于控制翻页；page_1 的设计：水平布局的标签控件 label_2、label_3 用于显示原始图片和处理图片，控件用于控制处理方法和参数，按钮控件 pushButton_9~11 用于控制翻页；page_2 的设计：表格控件 tableWidget 控件用于显示表格数据，按钮控件用于控制。将完成的堆叠布局界面设计文件另存为 uiDemo8.ui，不同页面的编辑状态如下图所示：
堆叠布局 page_0 设计图：
堆叠布局 page_1 设计图：
堆叠布局 page_2 设计图：
3. 堆叠布局的主程序设计
使用堆叠窗口控件（QStackedWidget）建立的堆叠布局界面，要在主程序中通过编程控制显示哪一个图形界面。
3.1 QStackedWidget 类QStackedWidget 类继承自 QFrame类。QStackedWidge t类提供了多页面切换的布局，一次只能看到一个界面。
QStackedWidget 类的信号：
currentChanged(int index)：当前页面发生变化时候发射，index 为新的索引值。widgetRemoved(int index)：页面被移除时候发射，index 为页面对应的索引值。QStackedWidget 类的槽函数：
setCurrentIndex(int index)：设置索引 index 所在的页面为当前页面。setCurrentWidget(QWidget *widget)：设置QWidget页面为当前页面。简单地说，使用如下程序可以设置 page_0 为当前显示的页面：
pageNo = 0 # 设置 page_0 为索引页（第一页面） self.stackedWidget.setCurrentIndex(pageNo) # 设置使用 pageNo=0 作为当前显示页面需要注意的是，不论我们为每个页面控件设置的名称（objectName）是什么，在 QStackedWidget 类中定义的页面索引 index 都是一个从 0 开始计数，即：第一页面的索引值 index=0，第二页面的索引值 index=1，…。
因此，为了避免混淆，建议将 StackedWidge 控件的第一页面命名为 objectName: page_0，第二页面命名为 objectName: page_1，…
3.2 建立信号/槽连接
建立信号/槽连接，既可以在 QtDesigner 中设置，也可以在主程序中通过程序实现。
以下例程是在程序中建立信号/槽连接。
# 通过 connect 建立信号/槽连接，点击按钮事件发射 triggered 信号，执行相应的子程序 click_pushButton self.pushButton_1.clicked.connect(self.click_pushButton_1) # 点击 pushButton_1 触发 self.pushButton_2.clicked.connect(self.click_pushButton_2) # 点击 pushButton_2 触发 self.pushButton_3.clicked.connect(self.click_pushButton_3) # 点击 pushButton_3 触发3.3 页面控制程序
通过编程控制堆叠窗口控件的显示页面，就是说当前显示哪一个图形界面。
一种简单的方法是，在任务场景的子程序中，直接使用 setCurrentIndex() 设置选择堆叠控件的显示页面。通俗的说就是，任务需要使用哪个场景时，就在程序中编写页面设置语句进行选择。例如：
def click_pushButton_1(self): # 点击 pushButton_1 触发 self.textEdit.append("当前动作：click_pushButton_1") self.textEdit.append("选择堆叠布局页面：page_0") self.stackedWidget.setCurrentIndex(0) # 打开 stackedWidget > page_0 self.label_1.setPixmap(QtGui.QPixmap("../image/fractal01.png")) return另一种高级的应用方法是，通过自定义页面控制函数，获取当前信号 sender 检索 objectName，来选择堆叠窗口控件的显示页面。这种方法更清晰地体现业务与界面的分离。例如：
def frameController(self): # 页面控制函数 sender = self.sender().objectName() # 获取当前信号 sender index = { "pushButton_1": 0, # page_0 "pushButton_2": 1, # page_1 "pushButton_3": 2, # page_2 } self.stackedWidget.setCurrentIndex(index[sender]) # 根据信号 index 设置所显示的页面3.4 堆叠布局中的控件操作
控件操作包括控件发出信号和在槽函数中进行操作。
在用户编写的程序中，需要接收控件信号、或在槽函数中对控件进行操作，都要通过控件的 objectName 来实现。
例如，点击按钮 “第一章”（pushButton_1），就选择堆叠布局页面 “page_0”；要在标签控件 “label_1” 显示图片 “…/image/fractal01.png”，就使用以下的程序：
self.label_1.setPixmap(QtGui.QPixmap("../image/fractal01.png"))而对于堆叠布局页面 “page_0” 中的按钮控件 “上一张”、“下一张”、“返回”，要实现点击按钮时执行相应的任务，则应以控件的 objectName 建立触发信号与槽函数的连接。例如：
# 通过 connect 建立信号/槽连接，点击按钮事件发射 triggered 信号，执行相应的子程序 click_pushButton self.pushButton_6.clicked.connect(self.click_pushButton_6) # 点击按钮 "上一张" 触发 self.pushButton_7.clicked.connect(self.click_pushButton_7) # 点击按钮 "下一张" 触发 self.pushButton_8.clicked.connect(self.click_pushButton_8) # 点击按钮 "返回" 触发需要特别提醒的是：堆叠布局的每个页面中的各个控件都是相互独立的不同的控件，具有不同的控件名称 objectName。
例如，page_0 中的按钮控件 “上一张”、“下一张”，与 page_1 中的按钮控件 “上一张”、"下一张"是不同的控件，具有不同的控件名称 objectName。
从 QtDesigner 可以清楚地看到所有控件名称及隶属关系。“stackedWidget” 堆叠布局页面 “page_0” 中的按钮控件 “上一张”、“下一张”、“返回”，objectName 分别是 pushButton_6、pushButton_7、pushButton_8；而页面 “page_1” 中的按钮控件 “上一张”、“下一张”、“返回”，objectName 分别是 pushButton_9、pushButton_10、pushButton_11。
4. 程序运行图
先上两张程序运行结果图。
我们的图形窗口如图所示，看起来已经有模有样了。
需要放完整程序吗？如果需要的话请在评论区留言。
【本节完】
版权声明：
欢迎关注『Python 真实的嚓茶从零开始 PyQt5 项目实战 @ Youcans』 原创作品
原创作品，转载必须标注原文链接：(https://blog.csdn.net/youcans/article/details/120758726)
Copyright 2021 youcans, XUPT
Crated：2021-10-16
欢迎关注『Python 真实的嚓茶从零开始 PyQt5 项目实战 @ Youcans』系列，持续更新中
Python 真实的嚓茶从零开始 PyQt5 项目实战（1）安装与环境配置
Python 真实的嚓茶从零开始 PyQt5 项目实战（2）菜单和工具栏
Python 真实的嚓茶从零开始 PyQt5 项目实战（3）信号与槽的连接
Python 真实的嚓茶从零开始 PyQt5 项目实战（4）基本控件
Python 真实的嚓茶从零开始 PyQt5 项目实战（5）布局管理
Python 真实的嚓茶从零开始 PyQt5 项目实战（6）窗口切换的堆叠布局
Python 真实的嚓茶从零开始 PyQt5 项目实战（7）折叠侧边栏的实现