Qt学习——堆栈窗体QStackedWidget类

本文介绍如何使用Qt的QStackedWidget组件实现窗口内的多窗体切换功能,通过设置列表框和堆栈窗体,实现选中列表项即显示相应窗体的效果。包括初始化列表框、新建堆栈窗体并添加标签、设置主窗体布局及消息关联等步骤。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

这些窗体都比较类似,相对简单,就没什么可以深入研究的了。


下面用代码实现上面窗口的设计:

1.建立项目时基类选择QDialog,取消Gernerate form复选框的选中状态。

2.在头文件dialog.h中编写如下代码:

#include <QtGui/QDialog>
#include <QListWidget>
#include <QStackedWidget>
#include <QLabel>

class Dialog : public QDialog
{
    Q_OBJECT

public:
    Dialog(QWidget *parent = 0);
    ~Dialog();
private:
    QListWidget *leftlist;
    QStackedWidget *stack;
    QLabel *label1;
    QLabel *label2;
    QLabel *label3;
};


3.在源文件dialog.cpp中编写如下代码:

#include "dialog.h"
#include <QHBoxLayout>
Dialog::Dialog(QWidget *parent)
    : QDialog(parent)
{
     setWindowTitle(tr("StackedWidget"));
     //设置列表框
     leftlist=new QListWidget(this);
     leftlist->insertItem(0,tr("window1"));
     leftlist->insertItem(1,tr("window2"));
     leftlist->insertItem(2,tr("window3"));
     //设置堆栈窗体
     label1=new QLabel(tr("WindowTest1\n\tby liming"));
     label2=new QLabel(tr("WindowTest2\n\tby liming"));
     label3=new QLabel(tr("WindowTest3\n\tby liming"));

     stack=new QStackedWidget(this);
     stack->addWidget(label1);
     stack->addWidget(label2);
     stack->addWidget(label3);
     //设置主窗体布局
     QHBoxLayout *mainLayout=new QHBoxLayout(this);
     mainLayout->setMargin(5);
     mainLayout->setSpacing(5);
     mainLayout->addWidget(leftlist);
     mainLayout->addWidget(stack,0,Qt::AlignHCenter);
     mainLayout->setStretchFactor(leftlist,1);
     mainLayout->setStretchFactor(stack,3);
     connect(leftlist,SIGNAL(currentRowChanged(int)),stack,SLOT(setCurrentIndex(int)));
}


解析:

1.这里的程序是,选中左边列表框内的内容,显示相应的窗体。


2.所以,第一步是初始化列表框QListWidget。


3.第二步新建堆栈窗体:

stack=new QStackedWidget(this);
然后将三个相应的label放入其中:

stack->addWidget(label1);
stack->addWidget(label2);
stack->addWidget(label3);


4.设置主窗体布局时,用到了布局管理器。这里用到的是水平排列窗体QHBoxLayout:

QHBoxLayout *mainLayout=new QHBoxLayout(this);

这个布局管理器用法为:

×对话框边距设为5

mainLayout->setMargin(5);

×内部控件间距为5

mainLayout->setSpacing(5);

×对于setStetchFactor函数,借用别的文章说明(http://blog.youkuaiyun.com/lin49940/article/details/6033727):

这里讲得是QSplitter的setStetchFactor函数:

程序为

 对于B 和 A 来说, 他们的本身的大小相对于整个窗口来说, 都是很小的. 这样就存在着一些多余的空间, 这些空间可以给B, 也可以给A, 或者两个平分. 对于B 和 A 各自空间大小的控制, 是通过 QSplitter 的 setStretchFactor 方法, 该方法的声明:

 

      void setStretchFactor(int index, int stretch);

 

      第一个参数index 是子微件的索引值, 从0 开始. 这里的话, B 是0, A 是1; 第二个参数 stretch 是拉伸系数, int 类型, 下面主要对stretch 的数值进行说明.

 

      1.  mainSplitter->setStretchFactor(0, -2);

      效果如下,

      

      B占据了所有多余的空间, 看来 stretch 的值如果为负整数, 那这个微件将占据最大的空间.

 

      2.     mainSplitter->setStretchFactor(0, -2);
              mainSplitter->setStretchFactor(1, -4);

      效果如下:

      

 

      B 和 A 平分了空间, 看来stretch 如果是负整数就会尽可能的占据空间, 而不看负整数的大小, 把 -2 改为 -12, 结果一样的.

 

      3.     mainSplitter->setStretchFactor(0, 0);
              mainSplitter->setStretchFactor(1, 0);

       效果同第二.

 

       4.       mainSplitter->setStretchFactor(0, 0);  //可以把这段注释掉, 效果一样
                 mainSplitter->setStretchFactor(1, 1);

       效果如下:

       

 

       5.     mainSplitter->setStretchFactor(0, 4);
               mainSplitter->setStretchFactor(1, 8);

       效果如下:

       

 

       6.     mainSplitter->setStretchFactor(0, -4);
               mainSplitter->setStretchFactor(1, 8);

      效果如下,

      

 

       从 1, 2 和 6 的测试效果可以看出, 拉伸系数为负整数的微件将占据最大的多余空间.

       从3, 4 和 5 的测试效果来看, 就算我们不设置 B 或 A 的拉伸系数stretch, 他们内部也应该存在着一个默认拉伸系数值0. stretch为 0 的微件, 将把最大多余空间让给stretch 为正整数的微件. 如果有多个stretch 为正整数的微件, 他们的多余空间的占有率由通过数字的比例来确定的.


注:因此,我的堆栈窗体程序中的

     mainLayout->setStretchFactor(leftlist,1);
     mainLayout->setStretchFactor(stack,3);
就是设定了list与stack比例为1:3。


5.设定消息相应的信号与槽:

connect(leftlist,SIGNAL(currentRowChanged(int)),stack,SLOT(setCurrentIndex(int)));
都是控件自带的信号与槽,这里将其关联起来,就达到了程序的设计效果:

更改第几行就显示第几个Label。

最后编译运行:



### 多页面电子钟的设计与实现 为了实现一个多页面的电子钟,可以利用 Qt 的 `QStackedWidget` 来管理多个页面,并通过按钮或其他控件来切换这些页面。以下是具体的实现方法: #### 页面布局设计 可以通过 Qt Creator 的 UI 设计工具完成多页面布局的设计工作[^1]。在主窗口中添加一个 `QStackedWidget` 控件作为容器,用于承载不同的页面。每个页面都可以是一个独立的 QWidget 或其他自定义组件。 #### 数字时钟的功能实现 根据已有资料[^2],可以创建一个数字时钟并将其嵌入到某个页面中。该通常会继承自 `QWidget` 并使用 `QLCDNumber` 显示当前时间。同时,还需要引入 `QTimer` 定时更新时间数据[^3]。 #### 主窗体结构 主窗体应包含以下几个部分: 1. **导航栏**:提供按钮或菜单项供用户选择不同页面。 2. **堆栈式视图 (`QStackedWidget`)**:用来展示各个子页面的内容。 3. **状态栏(可选)**:显示一些额外的信息或者提示消息。 下面是完整的代码示例: ```python import sys from PyQt5.QtWidgets import QApplication, QMainWindow, QStackedWidget, QPushButton, QVBoxLayout, QWidget, QLabel, QLCDNumber from PyQt5.QtCore import QTimer, QDateTime class DigitalClock(QLCDNumber): def __init__(self, parent=None): super().__init__(parent) self.setSegmentStyle(QLCDNumber.Filled) timer = QTimer(self) timer.timeout.connect(self.show_time) timer.start(1000) # 每秒刷新一次 def show_time(self): time = QDateTime.currentDateTime().toString('hh:mm:ss') self.display(time) class Page(QWidget): def __init__(self, title="Page"): super().__init__() layout = QVBoxLayout() label = QLabel(title) layout.addWidget(label) self.setLayout(layout) class MainWindow(QMainWindow): def __init__(self): super().__init__() self.setWindowTitle("Multi-page Digital Clock") self.stacked_widget = QStackedWidget() # 添加第一个页面 - 数字时钟 clock_page = QWidget() clock_layout = QVBoxLayout(clock_page) digital_clock = DigitalClock() # 实现数字时钟功能 clock_layout.addWidget(digital_clock) self.stacked_widget.addWidget(clock_page) # 添加第二个页面 - 文本说明页 text_page = Page("This is a Text Page") self.stacked_widget.addWidget(text_page) # 设置初始页面索引为第一页 (即数字时钟) self.setCentralWidget(self.stacked_widget) # 导航按钮设置 navigation_bar = QWidget() nav_layout = QVBoxLayout(navigation_bar) btn_clock = QPushButton("Digital Clock") btn_text = QPushButton("Text Page") btn_clock.clicked.connect(lambda: self.switch_to_index(0)) btn_text.clicked.connect(lambda: self.switch_to_index(1)) nav_layout.addWidget(btn_clock) nav_layout.addWidget(btn_text) self.addDockWidget(Qt.LeftDockWidgetArea, QDockWidget("Navigation", self)) dock = self.findChild(QDockWidget) dock.setWidget(navigation_bar) def switch_to_index(self, index): """ 切换到指定索引对应的页面 """ self.stacked_widget.setCurrentIndex(index) if __name__ == "__main__": app = QApplication(sys.argv) window = MainWindow() window.resize(400, 300) window.show() sys.exit(app.exec_()) ``` 上述程序展示了如何构建一个多页面应用,其中包含了两个主要页面——一个是带有数字时钟的页面;另一个则是普通的文本页面。用户可通过左侧导航栏中的按钮自由切换这两个页面[^4]。 #### 注意事项 - 需要安装 PyQt5 库才能运行此脚本。 - 如果目标平台是嵌入式设备,则可能需要考虑资源消耗以及屏幕分辨率适配等问题。
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值