【QT】一个界面中嵌入其它界面(二)
以下是使用 QStackedWidget
实现动态切换界面的完整代码,包含详细的注释和实现步骤:
完整代码
1. 子界面类:Page1 和 Page2
首先创建两个简单的子界面类,用于嵌入到 QStackedWidget
中。
// Page1.h
#ifndef PAGE1_H
#define PAGE1_H#include <QWidget>
#include <QLabel>
#include <QVBoxLayout>class Page1 : public QWidget {Q_OBJECT
public:explicit Page1(QWidget* parent = nullptr) : QWidget(parent) {QLabel* label = new QLabel("这是页面 1", this);label->setAlignment(Qt::AlignCenter);QVBoxLayout* layout = new QVBoxLayout(this);layout->addWidget(label);setLayout(layout);}
};#endif // PAGE1_H
// Page2.h
#ifndef PAGE2_H
#define PAGE2_H#include <QWidget>
#include <QLabel>
#include <QVBoxLayout>class Page2 : public QWidget {Q_OBJECT
public:explicit Page2(QWidget* parent = nullptr) : QWidget(parent) {QLabel* label = new QLabel("这是页面 2", this);label->setAlignment(Qt::AlignCenter);QVBoxLayout* layout = new QVBoxLayout(this);layout->addWidget(label);setLayout(layout);}
};#endif // PAGE2_H
2. 主窗口类:MainWindow
实现主窗口,包含 QStackedWidget
和切换按钮。
// MainWindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H#include <QMainWindow>
#include <QStackedWidget>
#include <QPushButton>
#include <QVBoxLayout>
#include "Page1.h"
#include "Page2.h"class MainWindow : public QMainWindow {Q_OBJECT
public:explicit MainWindow(QWidget* parent = nullptr);private:QStackedWidget* stackedWidget;
};#endif // MAINWINDOW_H
// MainWindow.cpp
#include "MainWindow.h"MainWindow::MainWindow(QWidget* parent) : QMainWindow(parent) {// 1. 创建 QStackedWidget 并添加子界面stackedWidget = new QStackedWidget(this);Page1* page1 = new Page1(stackedWidget);Page2* page2 = new Page2(stackedWidget);stackedWidget->addWidget(page1); // 索引 0stackedWidget->addWidget(page2); // 索引 1// 2. 创建切换按钮QPushButton* switchButton = new QPushButton("切换页面", this);connect(switchButton, &QPushButton::clicked, [=]() {// 计算下一个页面的索引(0 或 1)int nextIndex = (stackedWidget->currentIndex() + 1) % 2;stackedWidget->setCurrentIndex(nextIndex);});// 3. 布局管理QVBoxLayout* layout = new QVBoxLayout();layout->addWidget(switchButton);layout->addWidget(stackedWidget);QWidget* container = new QWidget(this);container->setLayout(layout);setCentralWidget(container); // 将容器设置为主窗口的中央部件// 4. 窗口属性setWindowTitle("QStackedWidget 示例");resize(400, 300);
}
3. 主函数:main.cpp
启动应用程序并显示主窗口。
// main.cpp
#include <QApplication>
#include "MainWindow.h"int main(int argc, char* argv[]) {QApplication app(argc, argv);MainWindow window;window.show();return app.exec();
}
代码说明
关键步骤
-
创建子界面:
Page1
和Page2
继承自QWidget
,并在构造函数中设置布局和控件(例如QLabel
)。
-
QStackedWidget 管理子界面:
- 使用
addWidget()
将子界面添加到QStackedWidget
中,每个子界面的索引从 0 开始递增。 - 通过
setCurrentIndex()
切换当前显示的界面。
- 使用
-
切换按钮逻辑:
- 点击按钮时,计算下一个页面的索引(
currentIndex() + 1)% 总数
),实现循环切换。
- 点击按钮时,计算下一个页面的索引(
-
布局管理:
- 使用
QVBoxLayout
将按钮和QStackedWidget
垂直排列。 - 将布局设置到
QWidget
容器中,再将容器设置为主窗口的中央部件。
- 使用
运行效果
- 窗口初始显示
Page1
,内容为 “这是页面 1”。 - 点击按钮后切换到
Page2
,内容为 “这是页面 2”。 - 再次点击按钮回到
Page1
。
扩展功能
- 添加更多页面:只需创建新的子界面类,并调用
stackedWidget->addWidget(newPage)
。 - 自定义切换动画:使用
QPropertyAnimation
实现淡入淡出或滑动效果。 - 通过菜单切换:将按钮替换为
QMenu
或QToolBar
的菜单项。
此代码可直接复制到 Qt 项目中编译运行,确保在 .pro
文件中添加 QT += widgets
。