当前位置：首页 > news >正文

QT编程之QStackedWidget

news 来源：原创 2025/5/1 11:31:17

一、QStackedWidget概述

在 Qt 中，堆栈窗口通常指的是 QStackedWidget 控件，它是用于管理多个子窗口或页面的堆叠式容器。QStackedWidget 允许你在一个固定区域内显示多个子窗口，但同时只显示其中一个子窗口，其他子窗口则被堆叠在后面。这使得你可以创建多页的界面，如向导、选项卡或其他多视图应用程序。

以下是有关 QStackedWidget 的详细介绍和使用方法：

多页容器：QStackedWidget 是一个多页容器，允许你将多个子窗口放在一个固定区域内。
单页显示：在任何给定时间，只有一个子窗口是可见的，其他子窗口被隐藏，可以通过切换来显示不同的子窗口。
切换效果：你可以通过切换页面的方式，如设置当前页或使用动画效果，切换可见的子窗口。

二、常用函数

‌关键方法及信号‌

方法/信号	说明
`addWidget(QWidget *widget)`	添加新页面，返回索引。
`insertWidget(int index, QWidget *)`	在指定位置插入页面。
`removeWidget(QWidget *widget)`	移除页面（不删除对象，需手动释放内存）。
`currentIndex()` / `currentWidget()`	获取当前显示的页面索引或指针。
`setCurrentIndex(int index)`	通过索引切换页面。
`setCurrentWidget(QWidget *widget)`	通过指针切换页面。
`currentChanged(int index)`	‌信号‌：页面切换时触发，可监听此信号处理逻辑（如页面初始化）。

在子窗口切换时触发的信号

QObject::connect(stackedWidget, &QStackedWidget::currentChanged, [&](int index) {
    qDebug() << "当前子窗口索引已更改：" << index;
});

三、基本使用步骤‌

1. ‌在 Qt Designer 中添加 QStackedWidget‌

拖拽 QStackedWidget 到主窗口。

右键点击 QStackedWidget，选择 ‌Insert Page‌ 添加多个页面，每个页面可单独设计布局。或者单独设计每个页面，通过addWidget方法添加。

QStackedWidget *stackedWidget = new QStackedWidget;
QWidget *page1 = new QWidget;
QWidget *page2 = new QWidget;
stackedWidget->addWidget(page1);
stackedWidget->addWidget(page2);

2. ‌在代码中切换页面

// 获取 QStackedWidget 指针（假设对象名为 stackedWidget）
QStackedWidget *stackedWidget = findChild<QStackedWidget*>("stackedWidget");

// 通过索引切换页面（从 0 开始）
stackedWidget->setCurrentIndex(1);

// 通过页面指针切换
QWidget *page2 = stackedWidget->widget(1);
stackedWidget->setCurrentWidget(page2);

三、完整示例

‌场景‌：实现一个包含 3 个页面的向导，通过按钮切换页面。

1. ‌头文件 mainwindow.h

#include <QMainWindow>
#include <QStackedWidget>
#include <QPushButton>

class MainWindow : public QMainWindow {
    Q_OBJECT
public:
    MainWindow(QWidget *parent = nullptr);

private slots:
    void switchToPage1();
    void switchToPage2();
    void switchToPage3();

private:
    QStackedWidget *stackedWidget;
    QPushButton *btnPage1, *btnPage2, *btnPage3;
};

2. ‌源文件 mainwindow.cpp

#include "mainwindow.h"

MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent) {
    // 初始化堆栈窗口
    stackedWidget = new QStackedWidget(this);
    setCentralWidget(stackedWidget);

    // 添加三个页面
    QWidget *page1 = new QWidget();
    page1->setStyleSheet("background: #FF9999;"); // 示例样式
    stackedWidget->addWidget(page1);

    QWidget *page2 = new QWidget();
    page2->setStyleSheet("background: #99FF99;");
    stackedWidget->addWidget(page2);

    QWidget *page3 = new QWidget();
    page3->setStyleSheet("background: #9999FF;");
    stackedWidget->addWidget(page3);

    // 添加切换按钮
    btnPage1 = new QPushButton("Page 1", this);
    btnPage2 = new QPushButton("Page 2", this);
    btnPage3 = new QPushButton("Page 3", this);

    // 按钮位置布局（简单示例）
    btnPage1->move(10, 10);
    btnPage2->move(110, 10);
    btnPage3->move(210, 10);

    // 连接信号槽
    connect(btnPage1, &QPushButton::clicked, this, &MainWindow::switchToPage1);
    connect(btnPage2, &QPushButton::clicked, this, &MainWindow::switchToPage2);
    connect(btnPage3, &QPushButton::clicked, this, &MainWindow::switchToPage3);
}

// 槽函数：切换页面
void MainWindow::switchToPage1() { stackedWidget->setCurrentIndex(0); }
void MainWindow::switchToPage2() { stackedWidget->setCurrentIndex(1); }
void MainWindow::switchToPage3() { stackedWidget->setCurrentIndex(2); }

‌3. ‌主函数 main.cpp‌

#include <QApplication>
#include "mainwindow.h"

int main(int argc, char *argv[]) {
    QApplication a(argc, argv);
    MainWindow w;
    w.resize(400, 300);
    w.show();
    return a.exec();
}

四、高级用法

1. ‌动态添加/删除页面

// 动态添加页面
QWidget *newPage = new QWidget();
int index = stackedWidget->addWidget(newPage);

// 动态删除页面
QWidget *pageToRemove = stackedWidget->widget(2);
stackedWidget->removeWidget(pageToRemove);
delete pageToRemove; // 手动释放内存

2. ‌结合导航栏（如 QListWidget）

QListWidget *listWidget = new QListWidget(this);
listWidget->addItems({"Page 1", "Page 2", "Page 3"});

// 点击列表项切换页面
connect(listWidget, &QListWidget::currentRowChanged, stackedWidget, &QStackedWidget::setCurrentIndex);