专业的编程技术博客社区

网站首页 > 博客文章 正文

从零开始学Qt(23):QTabWidget动态显示和隐藏Tab卡片

baijin 2025-01-23 15:06:53 博客文章 135 ℃ 0 评论

Qt样式表(Qt Style Sheet,QSS)是一种强大的机制,可以自定义widget的几乎任何外观。本文利用样式表,对于QTabWidget组件,实现动态显示和隐藏Tab的功能。下面对具体步骤进行介绍。

利用窗口设计器设置样式

Qt Designer是预览样式表的优秀工具。右键单击设计器中的QTabWidget,然后选择“Change styleSheet...”设置样式表。

在Qt 4.2及更高版本中,Qt Designer还包括一个样式表语法高亮显示和验证器。验证器在“Edit Style Sheet”对话框的左下角指示语法是否有效。

当你单击“OK”或“Apply”时,Qt Designer将自动显示新样式的widget。这里设置了Tab的高度和宽度。

编写动态样式代码

先编写一个setQss函数,其功能是分别设置enable和disabled的卡片的属性。对于disabled的卡片,这里的关键是设置其宽度为0,同时颜色为透明。

void Widget::setQss()
{
ui->tabWidget->setStyleSheet("QTabBar::tab:enabled{width:130;height:40}"
                                                  "QTabBar::tab:disabled{width:0;height:40;color:transparent;}");
}

编写按钮响应代码

分别为显示(btnDisp)按钮和隐藏(btnHide)按钮添加启用和禁用某个Tab的代码,然后调用setQss()函数设置样式即可。

void Widget::on_btnDisp_clicked()
{
    int id = ui->spinBox->value();
    ui->tabWidget->setTabEnabled(id,true);
    setQss();
}

void Widget::on_btnHide_clicked()
{
    int id = ui->spinBox->value();
    ui->tabWidget->setTabEnabled(id,false);
    setQss();
}

预览效果:

启动程序后的界面如下图:

点击“隐藏”按钮,Tab 1卡片消失不见了(spinBox中的值为0,表示第一个Tab)。点击“显示”按钮,Tab 1将重新出现。

关于QSS的详细介绍见我之前的文章:

从零开始学Qt(20):QSS详解(1)- Qt样式表是什么?

从零开始学Qt(21):QSS详解(2)- QSS语法

从零开始学Qt(22):QSS详解(3)- 盒子模型

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表