Qt——多页面切换组件

1.QTabWidget

能够在同一个窗口中自由切换不同页面的内容
是一个容器类型的组件，同时提供友好的页面切换方式

2.使用方式：

在应用程序中创建QTabWidget的对象
将其他QWidget对象加入该对象中
在QTabWidget对象中加入一个组件将生成一个新的页面
QTabWidget对象每次只能加入一个QWidget对象

所以：如何将多个组件加入到一个QTabWidget页面中？

（1）创建容器类型的组件对象

（2）将多个子组件在容器对象中布局

（3）将容器对象加入QTabWidget中生成新的页面

Widget.h

复制代码

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QTabWidget>

class Widget : public QWidget
{
    Q_OBJECT

    QTabWidget m_tabWidget;

public:
    explicit Widget(QWidget *parent = nullptr);
    ~Widget() override;
};
#endif // WIDGET_H

Widget.cpp

复制代码

#include "Widget.h"
#include <QPlainTextEdit>
#include <QVBoxLayout>
#include <QLabel>
#include <QPushButton>

Widget::Widget(QWidget *parent) : QWidget(parent)
{

    m_tabWidget.setParent(this);
    m_tabWidget.move(10, 10);
    m_tabWidget.resize(200, 200);

    QPlainTextEdit* edit = new QPlainTextEdit(&m_tabWidget);
    edit->insertPlainText("1st Tab Page");

    m_tabWidget.addTab(edit, "1st");

    QWidget* widget = new QWidget(&m_tabWidget);
    QVBoxLayout* layout = new QVBoxLayout();
    QLabel* lb1 = new QLabel(widget);
    QPushButton* btn = new QPushButton(widget);

    lb1->setText("2nd Tab Page");
    lb1->setAlignment(Qt::AlignCenter);

    btn->setText("2nd Tab Page");

    layout->addWidget(lb1);
    layout->addWidget(btn);

    widget->setLayout(layout);
    m_tabWidget.addTab(widget, "2nd");
}

Widget::~Widget() = default;

运行结果：

3.QTabWidget的高级用法

设置Tab标签的位置（North、South、West、East）
设置Tab的外观（Rounded、Triangular）
设置Tab的可关闭模式

预定义信号

（1）void currentChanged(int index)：当前显示的页面发送变化，index为新页面下标

（2）void tabCloseRequested(int index)：位置为index页面的关闭按钮被点击发出关闭请求

Widget.h

复制代码

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QTabWidget>

class Widget : public QWidget
{
    Q_OBJECT

    QTabWidget m_tabWidget;

protected slots:
    void onTabCurrentChanged(int index);
    void onTabCLoseRequested(int index);
public:
    explicit Widget(QWidget *parent = nullptr);
    ~Widget() override;

};
#endif // WIDGET_H

Widget.cpp

复制代码

#include "Widget.h"
#include <QPlainTextEdit>
#include <QVBoxLayout>
#include <QLabel>
#include <QPushButton>
#include <QDebug>

Widget::Widget(QWidget *parent) : QWidget(parent)
{

    m_tabWidget.setParent(this);
    m_tabWidget.move(10, 10);
    m_tabWidget.resize(200, 200);
    m_tabWidget.setTabPosition(QTabWidget::South); //将组件放到南边
    m_tabWidget.setTabShape(QTabWidget::Triangular); //将组件形状设为圆角形
    m_tabWidget.setTabsClosable(true); //设为组件可关闭


    QPlainTextEdit* edit = new QPlainTextEdit(&m_tabWidget);
    edit->insertPlainText("1st Tab Page");

    m_tabWidget.addTab(edit, "1st");

    QWidget* widget = new QWidget(&m_tabWidget);
    QVBoxLayout* layout = new QVBoxLayout();
    QLabel* lb1 = new QLabel(widget);
    QPushButton* btn = new QPushButton(widget);

    lb1->setText("2nd Tab Page");
    lb1->setAlignment(Qt::AlignCenter);

    btn->setText("2nd Tab Page");

    layout->addWidget(lb1);
    layout->addWidget(btn);

    widget->setLayout(layout);
    m_tabWidget.addTab(widget, "2nd");

    m_tabWidget.setCurrentIndex(1);

    connect(&m_tabWidget, SIGNAL(currentChanged(int)), this, SLOT(onTabCurrentChanged(int)));
    connect(&m_tabWidget, SIGNAL(tabCloseRequested(int)), this, SLOT(onTabCLoseRequested(int)));
}
void Widget::onTabCurrentChanged(int index)
{
    qDebug() << "Page changed to: " << index;
}
void Widget::onTabCLoseRequested(int index)
{
    m_tabWidget.removeTab(index);
}
Widget::~Widget() = default;