一、Qt控件
00:00
1. QTabWidget基本用法
01:31
1)QTabWidget的介绍
基础概念:QTabWidget是Qt框架中的容器控件,用于创建带标签页的界面布局。
继承关系:默认从QWidget继承,包含多个可切换的子页面。
应用场景:适用于需要分页显示不同内容的界面设计,如设置对话框、多文档界面等。
2)QTabWidget的添加
02:09
控件添加方法
查找技巧:在Qt Designer中可通过过滤器直接搜索"tab"快速定位控件
拖拽操作:将TabWidget从控件面板拖拽至主窗体即可完成添加
页面管理:默认包含两个标签页(Tab1/Tab2),可通过右键菜单进行增删操作
页面内容定制
控件添加:在每个标签页内可自由添加其他控件(如按钮、文本框等)
示例操作:
第一页添加两个QPushButton
第二页添加垂直布局的QWidget
样式修改:支持通过样式表修改背景色(如设置为蓝色background-color: blue)
运行效果
原生特性:默认显示标签栏和当前页内容,支持鼠标点击切换
样式差异:与WPS等商业软件的标签页存在明显视觉差异
功能扩展:可通过insertTab()方法动态添加新页面,支持带图标和文本的标签
3)QTabWidget界面展示
03:29
基本布局特性
控件集成: 关闭按钮、放大按钮等功能按钮与标签页(tab)位于同一行
多元素共存: 标签页区域可同时包含控件和图标,支持右键菜单功能
非菜单特性: 右键弹出的不是标准菜单项,而是可添加控件的独立窗口
自定义标签页功能
添加方法:
int insertTab(int index, QWidget *page, const QString &label)
int insertTab(int index, QWidget *page, const QIcon &icon, const QString &label)
扩展特性:
支持在标签页区域添加自定义按钮
允许通过样式表修改标签页外观
可实现非等宽标签页布局
复杂界面实现
分层结构:
主界面采用多级TabWidget嵌套
下方功能区可视为独立标签页组
布局技术:
使用分裂器(QSplitter)实现区域划分
左右两侧可添加辅助控件组
样式定制:
通过样式表(QSS)深度定制界面
需要配合无边框窗口技术(第三章)
控件自定义技术将在第四章详解
4)QTabWidget的用法
05:44
QTabWidget的插入页操作
06:43
右键插入: 在QT设计器中右键点击tab页可选择"插入页",支持在当前页前/后插入新页
示例操作: 演示在tab1和tab2之间插入新页,并添加"123"控件
动态添加: 通过代码调用insertTab()方法,参数为(索引位置, QWidget页面, 标签文本)
QTabWidget的标题修改
07:22
设计器修改: 直接选中tab页修改objectName属性,但可能存在bug
代码修改: 推荐使用setTabText(index, text)方法更可靠
示例: 将第二页标题改为"第二页",需注意QT设计器可能显示异常
QTabWidget的界面修改
08:16
整体布局: 可对整个tabWidget应用水平/垂直布局,自动填充窗口
边界调整: 通过粉色边界区域调整页边距等参数
样式定制: 商业软件通常需要修改原生窗口样式,包括:
宽度/高度设置
颜色修改
其他属性调整
案例参考: WPS采用QWidget套QTabWidget实现,并去掉窗口边框
QTabWidget的删除操作
08:48
正确操作: 右键点击具体tab页选择"删除",而非直接删除整个控件
注意事项: 直接删除会移除整个tabWidget控件
代码删除: 对应removeTab(index)方法
QTabWidget的代码添加
09:34
QTabWidget的包含头文件
10:25
头文件: #include <QTabWidget>
命名规范: 建议使用有区分度的变量名如pTabWidget
QTabWidget的添加tab页
10:35
核心方法:
addTab(QWidget*, const QString&)
insertTab(int index, QWidget*, const QString&)
参数说明:
第一个参数:tab页索引位置
第二个参数:要添加的QWidget页面
第三个参数:标签文本
扩展方法: 带图标的版本insertTab(int, QWidget*, const QIcon&, const QString&)
QTabWidget的构造方法
12:06
标准构造: explicit QTabWidget(QWidget *parent = nullptr)
继承关系: 所有QT控件都继承自QWidget
QTabWidget的信号槽
12:29
关键信号:
currentChanged(int index): 当前页改变时触发
tabCloseRequested(int index): 页签关闭请求时触发
tabBarClicked(int index): 页签栏点击时触发
tabBarDoubleClicked(int index): 页签栏双击时触发
槽方法:
setCurrentIndex(int): 设置当前显示页
setCurrentWidget(QWidget*): 设置当前显示控件
应用案例
13:35
例题:QTabWidget插入tab页
步骤:
创建QTabWidget实例
新建多个QWidget作为页面
使用setStyleSheet设置不同背景色区分
调用insertTab方法添加页面
注意事项:
样式表属性名必须正确(如background-color)
拼写错误会导致样式不生效
建议使用代码创建而非设计器拖拽
应用案例
20:31
例题:QTabWidget信号槽
实现方式:
二、QTabWidget各种常见用法详解
23:01
1. 添加自定义tab
23:10
插入方法:使用insertTab()方法插入tab,支持带图标和不带图标两种形式:
关闭按钮设置:通过setTabsClosable(true)显示关闭按钮,触发关闭时会发出tabCloseRequested信号
关闭实现:实际关闭tab需要调用removeTab(index)方法,而不是close()方法
移动功能:通过setMovable(true)允许用户拖动tab改变顺序
位置设置:使用setTabPosition()设置tab显示位置,参数为枚举值:
形状设置:通过setTabShape()设置tab形状,可选Rounded(默认)或Triangular
2. 应用案例
32:24
1)例题:tab不可见示例
方法:使用setTabVisible(index, false)隐藏指定tab
效果:隐藏的tab不会保留空白位置,其他tab会前移填补
2)例题:鼠标悬浮提示信息设置
35:14
方法:使用setTabToolTip(index, tip)设置悬浮提示
示例:
注意事项:需要包含#ifndef QT_NO_TOOLTIP宏定义
3. 信号与槽
常用信号:
currentChanged(int index):当前tab改变时触发
tabCloseRequested(int index):点击关闭按钮时触发
tabBarClicked(int index):点击tab时触发
tabBarDoubleClicked(int index):双击tab时触发
连接示例: