| Qt5：TabWidget选项卡 | 您所在的位置：网站首页 › 如龙5支线 › Qt5：TabWidget选项卡 |
Qt5：TabWidget选项卡
|
Qt的Tab Widget控件会创建一个标签栏，标签栏上可以创建很多选项卡，默认自动生成两个（tab和tab_2），其它的自己添加，而每个选项卡又控制着一个界面，切换不同的选项卡就会跳转到相应的界面，实现了资源共享的功能。
这个简单示例是根据官方文档使用代码来创建选项卡，没有使用Qt设计师添加，Qt设计师只是添加了一个Tab Widget标签栏。打开Qt，新建一个Qt Widgets Application项目，转到设计师模式，从左侧工具栏添加一个Tab Widget控件到窗口上，调整Tab Widget控件的大小，修改Tab Widget控件的对象名为tabWidget，然后添加如下代码： mainwindow.h #ifndef MAINWINDOW_H #define MAINWINDOW_H #include namespace Ui { class MainWindow; } class MainWindow : public QMainWindow { Q_OBJECT public: explicit MainWindow(QWidget *parent = 0); ~MainWindow(); private: Ui::MainWindow *ui; }; #endif // MAINWINDOW_Hmainwindow.cpp #include "mainwindow.h" #include "ui_mainwindow.h" #include "QDebug" MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent), ui(new Ui::MainWindow) { ui->setupUi(this); setWindowTitle(tr("TabWidget"));//设置标题 ui->tabWidget->clear();//清空选项卡 QWidget *tabSports=new QWidget(this); QWidget *tabMusic=new QWidget(this); QWidget *tabSoftware=new QWidget(this); QWidget *tabDigital=new QWidget(this); QWidget *tabLanguage=new QWidget(this); ui->tabWidget->setTabPosition(QTabWidget::North);//设置选项卡的方位东南西北，默认在上方 ui->tabWidget->addTab(tabSports,tr("运动"));//在后面添加选项卡 ui->tabWidget->addTab(tabMusic,tr("音乐")); ui->tabWidget->addTab(tabSoftware,QIcon("F:\\磊神图片\\icons\\1.ico"),tr("软件"));//在后面添加带图标的选项卡 ui->tabWidget->insertTab(3,tabDigital,tr("数码"));//插入选项卡 ui->tabWidget->insertTab(4,tabLanguage,QIcon("F:\\磊神图片\\icons\\3.ico"),tr("语言"));//插入带图标的选项卡 ui->tabWidget->setTabShape(QTabWidget::Triangular);//设置选项卡的形状 //ui->tabWidget->removeTab(0);//移除选项卡 ui->tabWidget->setTabIcon(0,QIcon("F:\\磊神图片\\icons\\2.ico"));//设置选项卡图标 ui->tabWidget->setTabIcon(1,QIcon("F:\\磊神图片\\icons\\4.ico"));//设置选项卡图标 ui->tabWidget->setTabIcon(3,QIcon("F:\\磊神图片\\icons\\5.ico"));//设置选项卡图标 ui->tabWidget->setIconSize(QSize(50,25));//设置图标的大小(选项卡的大小也会改变) ui->tabWidget->setMovable(true); ui->tabWidget->setTabsClosable(true);//在选项卡上添加关闭按钮 qDebug()setTabEnabled(1,false); ui->tabWidget->setTabToolTip(2,tr("Beautiful"));//鼠标悬停弹出提示 ui->tabWidget->usesScrollButtons();//选项卡太多滚动 //ui->tabWidget->removeTab(0);//移除选项卡 //ui->tabWidget->setTabWhatsThis(3,tr("Beautiful Girl"));//不知道干嘛的 //ui->tabWidget->setTabBarAutoHide(true);//包含少于2个选项卡时会自动隐藏 //ui->tabWidget->setTabText(0,tr("软件"));//按索引修改选项卡的名称 //ui->tabWidget->setTabText(1,tr("舞蹈")); //ui->tabWidget->setDocumentMode(true);//设置选项卡是否以适合文档页面的模式呈现 //ui->tabWidget->setElideMode(Qt::ElideLeft);//标签栏中删除文字 //ui->tabWidget->clear();//清空选项卡 } MainWindow::~MainWindow() { delete ui; } 显示效果
综合示例Tab Widget选项卡控制着表格、柱状图、按钮和编辑框、树部件、列表部件的显示，里面用到了QCustomPlot类绘制柱状图，需要添加一些东西，使用方法请看另一篇文章：https://blog.csdn.net/mars_xiaolei/article/details/83281209。打开Qt，新建一个Qt Widgets Application项目，转到设计师模式，从左侧工具栏添加一个Tab Widget控件到窗口上，调整Tab Widget控件的大小，修改Tab Widget控件的对象名为tabWidget，选项卡和其它控件都是要自己添加的，每个选项卡控制这一个界面，然后添加如下代码： pro文件 #------------------------------------------------ # # Project created by QtCreator 2018-11-09T13:39:09 # #------------------------------------------------- QT += core gui greaterThan(QT_MAJOR_VERSION, 4): QT += widgets printsupport TARGET = QTabWidget TEMPLATE = app # The following define makes your compiler emit warnings if you use # any feature of Qt which has been marked as deprecated (the exact warnings # depend on your compiler). Please consult the documentation of the # deprecated API in order to know how to port your code away from it. DEFINES += QT_DEPRECATED_WARNINGS # You can also make your code fail to compile if you use deprecated APIs. # In order to do so, uncomment the following line. # You can also select to disable deprecated APIs only up to a certain version of Qt. #DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000 # disables all the APIs deprecated before Qt 6.0.0 SOURCES += \ main.cpp \ mainwindow.cpp \ qcustomplot.cpp HEADERS += \ mainwindow.h \ qcustomplot.h FORMS += \ mainwindow.uimainwindow.h #ifndef MAINWINDOW_H #define MAINWINDOW_H #include namespace Ui { class MainWindow; } class MainWindow : public QMainWindow { Q_OBJECT public: explicit MainWindow(QWidget *parent = 0); ~MainWindow(); private: Ui::MainWindow *ui; }; #endif // MAINWINDOW_Hmainwindow.cpp #include "mainwindow.h" #include "ui_mainwindow.h" #include "QDebug" #include //表格 #include //表格 #include "qcustomplot.h" #include #include "QStringList" MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent), ui(new Ui::MainWindow) { ui->setupUi(this); setWindowTitle(tr("TabWidget"));//设置标题 ui->tabWidget->setTabPosition(QTabWidget::North);//设置选项卡的方位东南西北，默认在上方 //ui->tabWidget->setTabShape(QTabWidget::Triangular);//设置选项卡的形状 ui->tabWidget->setTabIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\1.ico"));//设置选项卡图标 ui->tabWidget->setTabIcon(1,QIcon("E:\\Qt_Project\\QTabWidget\\2.ico"));//设置选项卡图标 ui->tabWidget->setTabIcon(2,QIcon("E:\\Qt_Project\\QTabWidget\\3.ico"));//设置选项卡图标 ui->tabWidget->setTabIcon(3,QIcon("E:\\Qt_Project\\QTabWidget\\4.ico"));//设置选项卡图标 ui->tabWidget->setTabIcon(4,QIcon("E:\\Qt_Project\\QTabWidget\\5.ico"));//设置选项卡图标 ui->tabWidget->setIconSize(QSize(50,25));//设置图标的大小(选项卡的大小也会改变) ui->tabWidget->setMovable(true); ui->tabWidget->setTabsClosable(true);//在选项卡上添加关闭按钮 qDebug()setColumnCount(6);//设置列数 ui->tableWidgetSports->setRowCount(10);//设置行数 ui->tableWidgetSports->setWindowTitle("QTableWidget"); QStringList m_Header; m_HeadersetEditTriggers(QAbstractItemView::NoEditTriggers);//设置编辑方式：禁止编辑表格 ui->tableWidgetSports->setSelectionBehavior(QAbstractItemView::SelectRows);//设置表格选择方式：设置表格为整行选中 //ui->qTableWidget->setSelectionBehavior(QAbstractItemView::SelectColumns);//设置表格选择方式：设置表格为整列选中 ui->tableWidgetSports->setSelectionMode(QAbstractItemView::SingleSelection);//选择目标方式 ui->tableWidgetSports->setStyleSheet("selection-background-color:pink");//设置选中颜色：粉色 for(int rows=0;rowssetItem(rows,columns,new QTableWidgetItem("刘翔")); } else if(columns==1) { ui->tableWidgetSports->setItem(rows,columns,new QTableWidgetItem("姚明")); } else if(columns==2) { ui->tableWidgetSports->setItem(rows,columns,new QTableWidgetItem("C罗")); } else if(columns==3) { ui->tableWidgetSports->setItem(rows,columns,new QTableWidgetItem("马林")); } else if(columns==4) { ui->tableWidgetSports->setItem(rows,columns,new QTableWidgetItem("林丹")); } else if(columns==5) { ui->tableWidgetSports->setItem(rows,columns,new QTableWidgetItem("孙杨")); } } } for(int rows=0;rowssetColumnWidth(columns,125); ui->tableWidgetSports->setRowHeight(rows,30); ui->tableWidgetSports->item(rows,columns)->setTextAlignment(Qt::AlignCenter);//居中显示 ui->tableWidgetSports->item(rows,columns)->setBackgroundColor(QColor(85,170,255));//设置前景颜色 ui->tableWidgetSports->item(rows,columns)->setTextColor(QColor(0,0,0));//设置文本颜色 ui->tableWidgetSports->item(rows,columns)->setFont(QFont("Helvetica"));//设置字体为黑体 } } //音乐选项卡 ui->qCustomPlotMusic->plotLayout()->insertRow(0); ui->qCustomPlotMusic->plotLayout()->addElement(0, 0, new QCPTextElement(ui->qCustomPlotMusic, "网易云音乐播放和评论统计图", QFont("微软雅黑",12, QFont::Bold))); // set dark background gradient设置暗背景梯度: QLinearGradient gradient(0, 0, 0, 400); gradient.setColorAt(0, QColor(200, 150, 220)); gradient.setColorAt(0.56, QColor(200, 150, 200)); gradient.setColorAt(1, QColor(220, 150, 200)); ui->qCustomPlotMusic->setBackground(QBrush(gradient)); // create empty bar chart objects创建三个空的条形图对象: QCPBars *LoveTime = new QCPBars(ui->qCustomPlotMusic->xAxis, ui->qCustomPlotMusic->yAxis);//播放 QCPBars *LoveTimes = new QCPBars(ui->qCustomPlotMusic->xAxis, ui->qCustomPlotMusic->yAxis2);//评论 //将LatencyTime和ErrorTimes并排显示 QCPBarsGroup *group = new QCPBarsGroup(ui->qCustomPlotMusic); LoveTime->setBarsGroup(group); LoveTimes->setBarsGroup(group); //设置抗锯齿 LoveTime->setAntialiased(false); // gives more crisp, pixel aligned bar borders:提供更清晰，像素对齐的条形边框 LoveTimes->setAntialiased(false); //设置叠加差距 //LatencyTime->setStackingGap(1); //ErrorTimes->setStackingGap(1); //fossil->setStackingGap(1); // set names and colors设置名称和颜色: LoveTimes->setWidth(0.3);//设置宽度 //ErrorTimes->setWidthType("wtPlotCoords");//wtAbsolute:wtAxisRectRatio:wtPlotCoords设置宽度 LoveTimes->setName("评论"); LoveTimes->setPen(QPen(QColor(250, 170, 20).lighter(150))); LoveTimes->setBrush(QColor(250, 170, 20)); LoveTime->setWidth(0.3);//设置宽度 //LatencyTime->setWidthType("wtPlotCoords");//wtAbsolute:wtAxisRectRatio:wtPlotCoords设置宽度 LoveTime->setName("播放"); LoveTime->setPen(QPen(QColor(0, 168, 140).lighter(130))); LoveTime->setBrush(QColor(0, 168, 140)); // stack bars on top of each other把一个Bar叠加在另外一个Bar上面 //ErrorTimes->moveAbove(fossil); //LatencyTime->moveAbove(ErrorTimes); //绘制xAxis QVector ticks; QVector labels; ticks xAxis->setBasePen(QPen(Qt::white));//设置轴基线颜色 ui->qCustomPlotMusic->xAxis->setTickPen(QPen(Qt::white));//设置刻度颜色 ui->qCustomPlotMusic->xAxis->grid()->setVisible(true);//网格可视 ui->qCustomPlotMusic->xAxis->grid()->setPen(QPen(QColor(130, 130, 130), 0, Qt::DotLine));//网格虚线 ui->qCustomPlotMusic->xAxis->setTickLabelColor(Qt::white);//设置刻度标签颜色 ui->qCustomPlotMusic->xAxis->setLabelColor(Qt::white);//设置轴标签的颜色 // 绘制yAxis: ui->qCustomPlotMusic->yAxis->setRange(0, 1000000);//设置轴范围的下限和上限 ui->qCustomPlotMusic->yAxis->setPadding(5); // 设置轴的填充a bit more space to the left border：在左边边界多留一点空间 ui->qCustomPlotMusic->yAxis->setLabel("播放次数(次)"); ui->qCustomPlotMusic->yAxis->setBasePen(QPen(Qt::white));//设置轴基线颜色 ui->qCustomPlotMusic->yAxis->setTickPen(QPen(Qt::white));//设置刻度线颜色 ui->qCustomPlotMusic->yAxis->setSubTickPen(QPen(Qt::white));//设置子刻度线颜色 ui->qCustomPlotMusic->yAxis->grid()->setSubGridVisible(true);//设置子网格可视 ui->qCustomPlotMusic->yAxis->setTickLabelColor(Qt::white);//设置刻度标签颜色 ui->qCustomPlotMusic->yAxis->setLabelColor(Qt::white);//设置轴标签的颜色 ui->qCustomPlotMusic->yAxis->grid()->setPen(QPen(QColor(130, 130, 130), 0, Qt::SolidLine));//设置网格颜色和线型，网格实线 ui->qCustomPlotMusic->yAxis->grid()->setSubGridPen(QPen(QColor(130, 130, 130), 0, Qt::DotLine));//设置子网格颜色和线型，网格虚线 // 绘制yAxis2: ui->qCustomPlotMusic->yAxis2->setRange(0, 10000);//设置轴范围的下限和上限 ui->qCustomPlotMusic->yAxis2->setPadding(5); // 设置轴的填充a bit more space to the left border：在左边边界多留一点空间 ui->qCustomPlotMusic->yAxis2->setLabel("评论次数(次)"); ui->qCustomPlotMusic->yAxis2->setBasePen(QPen(Qt::white));//设置轴基线颜色 ui->qCustomPlotMusic->yAxis2->setTickPen(QPen(Qt::white));//设置刻度线颜色 ui->qCustomPlotMusic->yAxis2->setSubTickPen(QPen(Qt::white));//设置子刻度线颜色 ui->qCustomPlotMusic->yAxis2->grid()->setSubGridVisible(true);//设置子网格可视 ui->qCustomPlotMusic->yAxis2->setTickLabelColor(Qt::white);//设置刻度标签颜色 ui->qCustomPlotMusic->yAxis2->setLabelColor(Qt::white);//设置轴标签的颜色 ui->qCustomPlotMusic->yAxis2->grid()->setPen(QPen(QColor(130, 130, 130), 0, Qt::SolidLine));//设置网格颜色和线型，网格实线 ui->qCustomPlotMusic->yAxis2->grid()->setSubGridPen(QPen(QColor(130, 130, 130), 0, Qt::DotLine));//设置子网格颜色和线型，网格虚线 ui->qCustomPlotMusic->yAxis2->setVisible(true);//默认为不可视，需要设置为可视 // Add data添加数据: QVector LoveTimesData, LoveTimeData; LoveTimesData setFont(legendFont);//设置默认字体 //ui->qCustomPlotMusic->setInteractions(QCP::iRangeDrag | QCP::iRangeZoom);//客户交互，界面可以移动 //软件选项卡 ui->radioButton_6->setChecked(true);//选中网易公开课 ui->checkBox->setChecked(true);//选中网易公开课 //ui->treeWidgetDigital->clear(); ui->treeWidgetDigital->setColumnCount(1); //设置列数 ui->treeWidgetDigital->setHeaderLabels(QStringList(tr("数码产品")));//设置头的标题 ui->treeWidgetDigital->setHeaderHidden(false); QTreeWidgetItem *items1 = new QTreeWidgetItem(ui->treeWidgetDigital, QStringList(QString("手机"))); items1->setIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\1.ico")); QTreeWidgetItem *items11 = new QTreeWidgetItem(items1, QStringList(QString("苹果"))); items11->setIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\2.ico")); QTreeWidgetItem *items12 = new QTreeWidgetItem(items1, QStringList(QString("华为"))); items12->setIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\3.ico")); QTreeWidgetItem *items13 = new QTreeWidgetItem(items1, QStringList(QString("小米"))); items13->setIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\4.ico")); QTreeWidgetItem *items2 = new QTreeWidgetItem(ui->treeWidgetDigital, QStringList(QString("笔记本电脑"))); items2->setIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\5.ico")); QTreeWidgetItem *items21 = new QTreeWidgetItem(items2, QStringList(QString("Dell"))); items21->setIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\6.ico")); QTreeWidgetItem *items22 = new QTreeWidgetItem(items2, QStringList(QString("华硕"))); items22->setIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\7.ico")); QTreeWidgetItem *items3 = new QTreeWidgetItem(ui->treeWidgetDigital, QStringList(QString("平板电脑"))); items3->setIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\8.ico")); QList rootList; QTreeWidgetItem *items4 = new QTreeWidgetItem; //添加第一个父节点 items4->setText(0,tr("数码相机")); items4->setIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\9.ico")); rootList.append(items4); QTreeWidgetItem *items41= new QTreeWidgetItem(items4,QStringList(QString("索尼"))); //添加子节点 items41->setIcon(0,QIcon("E:\\Qt_Project\\QTabWidget\\10.ico")); items4->addChild(items41); ui->treeWidgetDigital->insertTopLevelItems(0,rootList); //将结点插入部件中 ui->treeWidgetDigital->expandAll(); //结点全部展开 //ui->items1->setText(0, "手机"); //ui->treeWidgetDigital->addTopLevelItem(new QTreeWidgetItem((QTreeWidget*)0)); //ui->treeWidgetDigital->addTopLevelItem(tr("笔记本电脑")); //语言选项卡 ui->listWidgetLanguage->addItem(tr("中文")); ui->listWidgetLanguage->addItem(tr("英语")); ui->listWidgetLanguage->addItem(tr("法语")); ui->listWidgetLanguage->addItem(tr("德语")); ui->listWidgetLanguage->addItem(tr("日语")); ui->listWidgetLanguage->addItem(tr("韩语")); ui->listWidgetLanguage->addItem(tr("俄语")); } MainWindow::~MainWindow() { delete ui; } 显示效果
简单示例百度网盘链接：https://pan.baidu.com/s/1oIeuz7A3q_eZQ7XY1CjzcA 提取码：ir81 综合示例百度网盘链接：https://pan.baidu.com/s/1rhM_9ij0cXGLdQ_kh3yPmw 提取码：ppbe |
【本文地址】
公司简介
联系我们