PyQt5 implements QTabWidget for multi-page switching

1. Introduction to QTabWidget class

The QTabWidget class directly inherits from QWidget. This class provides a tab bar (QTabBar) and a corresponding page area for displaying the page corresponding to each tab. The layout principle is the same as that of QStackedLayout, only the current page (that is, the visible page) is visible, and all other pages are invisible. Users can display other corresponding pages by selecting different tabs.
Page or page part: actually a container (usually created using QWidget)
The QTabWidget class is a class that implements multi-page switching. This class has already realized some functions of multi-page switching. It only needs a small amount of design (mainly to design the content in the page) to realize multi-page switching. . Therefore, when using this class to achieve multi-page switching, there is no need to use the QStackedLayout layout to associate pages with tabs, nor to use a layout similar to QVBoxLayout to place tabs and pages together
Most of the functionality of the QTabWidget class is provided by QTabBar (mainly dealing with the tab part) and QStackedWidget (mainly dealing with the functionality of organizing pages).

2. Steps to use the QTabWidget class

The steps to use QTabWidget are:

Create a QTabWidget
Create a page (container) for each tab, usually a QWidget (do not specify a parent widget)
Insert subcomponents into page components (ie containers)
Use addTab() or insertTab() to place page widgets into tab widgets
If the content in the container is not visible, use the resize() function to set the size of the QTabWidget to make it visible

The approximate code form is:

my_tabwidget = QTabWidget() # 构造选项卡部件
widget1 = widget2 = widget3 = QWidget() # 创建容器
...... # 向容器中添加需要显示的内容，略
my_tabwidget.addTab(widget1, 'AAA') # 把容器widget1作为选项卡AAA的页面
my_tabwidget.addTab(widget2, 'BBB') # 把容器widget2作为选项卡BBB的页面
my_tabwidget.addTab(widget3, 'CCC') # 把容器widget3作为选项卡CCC的页面
......  # 其他业务代码

3. Properties in the QTabWidget class

Most of the properties and functions in the QTabWidget class are the same as those in the QTabBar
20221120163406
20221120163440
20221120163458

4. Functions in the QTabWidget class

For details, please refer to the official document https://www.riverbankcomputing.com/static/Docs/PyQt5/api/qtwidgets/qtabwidget.html?highlight=qtabwidget#QTabWidget

Five, the signal in the QTabWidget class

void currentChanged(int index);
This signal is sent when the current tab on the tab bar changes, index is the index of the new tab, or -1 if there is no new index (for example, there is no tab in QTabBar). This signal is more important.
void tabBarClicked(int index);
void tabBarDoubleClicked(int index);
The above signal indicates that this signal is sent when the tab at index is clicked or double-clicked, index is the index of the clicked tab, and −1 if there is no tab under the cursor.
void tabCloseRequested(int index);
This signal is sent when the close button on a tab is clicked, index is the index of the tab that should be deleted.

Six, QTabWidget class sample code

The sample code for implementing multi-page switching using the QTabWidget class (tab widget) is as follows:

from PyQt5.QtWidgets import QApplication, QWidget, QTabWidget, QRadioButton, QPushButton, QVBoxLayout
import sys

class MyTabWidget(QTabWidget):
  def __init__(self, parent=None) -> None:
    super().__init__(parent)

  def remove_tab_handler(self):
    '''
    槽函数, 移除索引为0的选项卡
    '''
    super().removeTab(0)


if __name__ == '__main__':
  app = QApplication(sys.argv)

  top_widget = QWidget()

  # 创建3个容器
  tab1_widget = QWidget()
  tab2_widget = QWidget()
  tab3_widget = QWidget()

  # 创建一些子部件
  remove_tab_btn = QPushButton('removeTab')
  page1_radio1 = QRadioButton('A')
  page1_radio2 = QRadioButton('B')
  page2_radio1 = QRadioButton('C')
  page2_radio2 = QRadioButton('D')
  page3_radio1 = QRadioButton('E')
  page3_radio2 = QRadioButton('F')

  # 为3个标签页分别创建布局
  page1_vbox_layout = QVBoxLayout()
  page1_vbox_layout.addWidget(page1_radio1)
  page1_vbox_layout.addWidget(page1_radio2)
  tab1_widget.setLayout(page1_vbox_layout)

  page2_vbox_layout = QVBoxLayout()
  page2_vbox_layout.addWidget(page2_radio1)
  page2_vbox_layout.addWidget(page2_radio2)
  tab2_widget.setLayout(page2_vbox_layout)

  page3_vbox_layout = QVBoxLayout()
  page3_vbox_layout.addWidget(page3_radio1)
  page3_vbox_layout.addWidget(page3_radio2)
  tab3_widget.setLayout(page3_vbox_layout)

  # 创建QTabWidget部件
  my_tabwidget = MyTabWidget(top_widget)

  # 把容器添加到对应的选项卡之下
  my_tabwidget.addTab(tab1_widget, 'tabA')
  my_tabwidget.addTab(tab2_widget, 'tabB')
  my_tabwidget.addTab(tab3_widget, 'tabC')

  # 顶层窗口的布局
  top_vbox_layout = QVBoxLayout()
  top_vbox_layout.addWidget(remove_tab_btn)
  top_vbox_layout.addWidget(my_tabwidget)
  top_widget.setLayout(top_vbox_layout)

  # 关联信号和槽
  remove_tab_btn.clicked.connect(my_tabwidget.remove_tab_handler)
  # 使用QTabWidget就可以省略类似于下面的选项卡与容器的信号和槽的关联步骤
  # my_tabwidget.currentChanged.connect(my_stacked_layout.setCurrentIndex)

  top_widget.show()
  sys.exit(app.exec_())

The effect of the program operation is as follows:

20221120180115
20221120180145
20221120180205