今天介绍容器控件的QTabWidget和QToolBox。
2.6.5 QTabWidget
当我们需要显示不同的信息窗口时,可以使用选项卡窗口。
选项卡窗口由一个标签栏和可见区域组成,默认情况下标签栏显示可见区域在最上方,但可以设置其显示的部位。
每个标签都与一个tab页关联,当激活一个标签,则对应的tab页显示,其它tab页隐藏。从左至右每个标签对应索引0~n。
QTabWidget的功能比较类似于QStackWidget。
QTabWidget直接继承QWidget,以下是QTabWidget的新增属性。可以不着急看属性,先试想,如果让你写一个QTabWidget,你会给这个类添加哪些属性。
1. 需要一个count属性来标识总共有count个标签。
2. 需要一个属性来记录当前标签页。
- 标签的索引从左至右或从上到下,从0开始。
3. documentMode可见区域是否以文档模式显示。
- 当为true时,文档模式会去掉QTabWidget周边的框架。
4. 当标签文字很长时,对于标签文字显示应该采用的省略策略,elideMode。
- Qt::ElideLeft:省略号在左边。
- Qt::ElideRight:省略号在右边。
- Qt::ElideMiddle:省略号在中间。
- Qt::ElideNone:显示全部文字。
5. 每个标签都可以有个图标,所以需要图标大小iconSize。图标的大小还可以通过样式表来设置,这个我们以后会讲。
6. 每个标签可以和其它标签交换前后顺序,moveable是否可交换。
7. 当只有一个标签时,该标签可以自动隐藏,tabBarAutoHide。
8. 标签不仅仅可以放在可见区域上方,还可以放在下方,左方,右方,tabPosition。
QTabWidget::North:(北)上方。
QTabWidget::South:(南)下方。
QTabWidget::West:(西)左方。
QTabWidget::East:(东)右方。
9. 标签也可以有不同的形状,tabShape。
- QTabWidget::Rounded:默认矩形。
- QTabWidget::Triangular:三角形。
10. 标签也可以关闭,tabsClosable。这里要注意,虽然标签上显示了关闭按钮,但点击后标签并不关闭,而是会发出tabCloseRequested(int)信号,你需要连接该信号再调用removeTab槽来关闭标签。
11. 如果标签多了,也可以使用滚动按钮,usesScrollButtons。
2.6.6 QToolBox
这个QToolBox窗口类似于QQ的分组界面,我想大家应该很熟悉了。
我们直接来看它的属性:
同样的count用来记录分组item的个数,currentIndex记录当前展开的item页。并且索引也都是从0开始。
2.6.7 示例
新建Gui项目ContainerWidget2,类名为ContainerWidget2,基类继承自QWidget
ui界面
containerwidget2.h
#ifndef CONTAINERWIDGET2_H #define CONTAINERWIDGET2_H #include <QWidget> namespace Ui { class ContainerWidget2; } class ContainerWidget2 : public QWidget { Q_OBJECT public: explicit ContainerWidget2(QWidget *parent = 0); ~ContainerWidget2(); private slots: void on_combo_elide_currentIndexChanged(int index); void on_combo_tabposition_currentIndexChanged(int index); void on_combo_tabshape_currentIndexChanged(int index); void on_check_document_toggled(bool checked); void on_check_autohide_toggled(bool checked); void on_check_moveable_toggled(bool checked); void on_check_closable_toggled(bool checked); void on_check_scrollBtns_toggled(bool checked); void on_btn_addItem_clicked(); void on_btn_delItem_clicked(); private: Ui::ContainerWidget2 *ui; }; #endif // CONTAINERWIDGET2_H
containerwidget2.cpp
#include "containerwidget2.h" #include "ui_containerwidget2.h" ContainerWidget2::ContainerWidget2(QWidget *parent) : QWidget(parent), ui(new Ui::ContainerWidget2) { ui->setupUi(this); /*1 QTabWidget设置*/ //标签省略策略 QStringList textList; textList << "ElideLeft" <<"ElideRight" << "ElideMiddle" << "ElideNone"; ui->combo_elide->addItems(textList); //标签位置 textList.clear(); textList << "North" << "South" << "West" << "East"; ui->combo_tabposition->addItems(textList); //标签形状 textList.clear(); textList << "Rounded" << "Triangular"; ui->combo_tabshape->addItems(textList); //连接关闭槽 connect(ui->tabWidget, &QTabWidget::tabCloseRequested, ui->tabWidget, &QTabWidget::removeTab); //添加一个标签 ui->tabWidget->addTab(new QLabel("Add Tab"), tr("第三首歌")); } ContainerWidget2::~ContainerWidget2() { delete ui; } void ContainerWidget2::on_combo_elide_currentIndexChanged(int index) { ui->tabWidget->setElideMode((Qt::TextElideMode)index); } void ContainerWidget2::on_combo_tabposition_currentIndexChanged(int index) { ui->tabWidget->setTabPosition((QTabWidget::TabPosition)index); } void ContainerWidget2::on_combo_tabshape_currentIndexChanged(int index) { ui->tabWidget->setTabShape((QTabWidget::TabShape)index); } void ContainerWidget2::on_check_document_toggled(bool checked) { ui->tabWidget->setDocumentMode(checked); } void ContainerWidget2::on_check_autohide_toggled(bool checked) { ui->tabWidget->setTabBarAutoHide(checked); } void ContainerWidget2::on_check_moveable_toggled(bool checked) { ui->tabWidget->setMovable(checked); } void ContainerWidget2::on_check_closable_toggled(bool checked) { ui->tabWidget->setTabsClosable(checked); } void ContainerWidget2::on_check_scrollBtns_toggled(bool checked) { ui->tabWidget->setUsesScrollButtons(checked); } void ContainerWidget2::on_btn_addItem_clicked() { ui->toolBox->addItem(new QLabel("新item"), tr("untitled")); } void ContainerWidget2::on_btn_delItem_clicked() { int index = ui->toolBox->currentIndex(); if (index != -1) { ui->toolBox->removeItem(index); } }
好的,关于容器控件我们就讲完了,下节开始讲按钮控件。
如果你想第一时间看到小豆君的技术分享,就赶快关注吧。
欢迎关注小豆君的微信公众号:小豆君,只要关注,便可加入小豆君为大家创建的C++\Qt交流群,方便讨论学习。