赞
踩
设置QTabWidget在不同方向上的文字均水平显示。有两种方法,如下:
QTabWidget设置在设置Position为East或者West时,文字方向默认会从下到上显示。先通过以下方法实现tabBar更改方向,但文字始终垂直显示。
用到函数:
void setTabButton(int index,ButtonPosition position,QWidget *widget);//给tabBar添加控件
QWidget *tabButton(int index,ButtonPosition) const; //获取tab上添加的控件
tabWidget头文件
- #ifndef TABWIDGET_H
- #define TABWIDGET_H
- #include<QTableWidget>
- #include<QLabel>
- class tabWidget : public QTabWidget
- {
- Q_OBJECT
- public:
- explicit tabWidget(QWidget *parent = nullptr);
-
- void updateselect(); //用来设置一开始选中的状态
- int addTab(QWidget *widget, const QString &); //重载(不是虚函数)
-
- signals:
-
- public slots:
- void slotSetLabelColor(int color); //自定义槽(响应tabBar点击事件)
- };
-
- #endif // TABWIDGET_H
tabWidget cpp文件
- #include "tabwidget.h"
-
-
- tabWidget::tabWidget(QWidget *parent) : QTabWidget(parent)
- {
-
- connect(this,SIGNAL(tabBarClicked(int)),this,SLOT(slotSetLabelColor(int)));
-
- }
-
- void tabWidget::slotSetLabelColor(int index)
- {
- for(int i=0;i<this->count();i++)
- {
- this->tabBar()->tabButton(i,QTabBar::ButtonPosition::RightSide)->setStyleSheet("background-color:rgba(0,0,0,0);");
- }
- this->tabBar()->tabButton(index,QTabBar::ButtonPosition::RightSide)->setStyleSheet("background-color:rgba(0,0,0,0);color:white;");
-
- }
-
- int tabWidget::addTab(QWidget *widget, const QString &label)
- {
- int nRetrun=QTabWidget::addTab(widget,"");
- int count=this->count()-1;
- QLabel *labelTab=new QLabel(label,this);
- QFont ft;
- ft.setPointSize(20);
- labelTab->setFont(ft);
- labelTab->setAlignment(Qt::AlignCenter);
- this->tabBar()->setTabButton(count,QTabBar::ButtonPosition::RightSide,labelTab);
- this->tabBar()->tabButton(count,QTabBar::ButtonPosition::RightSide)->setFixedHeight(64);
- updateselect();
- return nRetrun;
-
- }
-
- void tabWidget::updateselect()
- {
- for(int i=0;i<this->currentIndex();i++)
- {
- this->tabBar()->tabButton(i,QTabBar::ButtonPosition::RightSide)->setStyleSheet("background-color:rgba(0,0,0,0);color:black;");
- }
- this->tabBar()->tabButton(this->currentIndex(),QTabBar::ButtonPosition::RightSide)->setStyleSheet("background-color:rgba(0,0,0,0);color:white;");
-
- }
mainWindow cpp
- #pragma execution_character_set("utf-8")
- #include "mainwindow.h"
- #include "ui_mainwindow.h"
- #include"tabwidget.h"
- MainWindow::MainWindow(QWidget *parent) :
- QMainWindow(parent),
- ui(new Ui::MainWindow)
- {
- ui->setupUi(this);
- tabWidget *m_tab=new tabWidget(this);
- QWidget *b1=new QWidget();
- QWidget *b2=new QWidget();
-
- m_tab->setGeometry(0,0,500,400);
- m_tab->setStyleSheet("QTabBar::tab{min-width:140px;max-width:140px;min-height:64px;max-height:64px;padding:0;}"
- "QTabBar::tab:selected{background:#025bc7}");
- //设置tabwidget位置 更改位置
- m_tab->setTabPosition(QTabWidget::TabPosition::South);
-
- if((m_tab->tabPosition()==QTabWidget::TabPosition::South)||
- (m_tab->tabPosition()==QTabWidget::TabPosition::North))
- m_tab->setLayoutDirection(Qt::LeftToRight);//LeftToRight
- else//东西方向的layoutDirection
- {
- m_tab->setLayoutDirection(Qt::RightToLeft);//RightToLeft
- }
- m_tab->addTab(b1,"one");
- m_tab->addTab(b2,"two");
- }
-
- MainWindow::~MainWindow()
- {
- delete ui;
- }
参考博客:https://blog.csdn.net/skyztttt/article/details/52448992
- #ifndef CUSTOMTABSTYLE_H
- #define CUSTOMTABSTYLE_H
- #include <QPainter>
- #include <QProxyStyle>
- #include <QStyleOptionTab>
- #include <QRect>
- #include <QSize>
- class CustomTabStyle : public QProxyStyle
- {
- public:
- QSize sizeFromContents(ContentsType type, const QStyleOption *option,
- const QSize &size, const QWidget *widget) const
- {
- QSize s = QProxyStyle::sizeFromContents(type, option, size, widget);
- if (type == QStyle::CT_TabBarTab) {
- s.transpose();
- s.rwidth() = 150; // 设置每个tabBar中item的大小
- s.rheight() = 50;
- }
- return s;
- }
- void drawControl(ControlElement element, const QStyleOption *option, QPainter *painter, const QWidget *widget) const
- {
- if (element == CE_TabBarTabLabel) {
- if (const QStyleOptionTab *tab = qstyleoption_cast<const QStyleOptionTab *>(option)) {
- QRect allRect = tab->rect;
- allRect.setWidth(allRect.width() - 5);
- allRect.setHeight(allRect.height() - 2);
- //选中状态
- if (tab->state & QStyle::State_Selected) {
- //save用以保护坐标,restore用来退出状态
- painter->save();
- painter->setBrush(QBrush(0x004ea1));
- //矩形
- //painter->drawRect(allRect.adjusted(0, 0, 0, 0));
- //带有弧线矩形
- painter->drawRoundedRect(tab->rect, 8, 8);
- painter->restore();
- }
- //hover状态
- else if(tab->state & QStyle::State_MouseOver){
- painter->save();
- painter->setBrush(QBrush(0x004ea1));
- painter->drawRoundedRect(allRect, 8, 8);
- painter->restore();
- }
- else{
- painter->save();
- painter->setBrush(QBrush(0x78aadc));
- painter->drawRoundedRect(allRect, 8, 8);
- painter->restore();
- }
- QTextOption option;
- option.setAlignment(Qt::AlignCenter);
- painter->setFont(QFont("楷体", 18, QFont::Bold));
- painter->setPen(0xffffff);
- painter->drawText(allRect, tab->text, option);
- return;
- }
- }
- if (element == CE_TabBarTab) {
- QProxyStyle::drawControl(element, option, painter, widget);
- }
- }
- };
tab->tabBar()->setStyle(new CustomTabStyle);//注意,设置上述代码风格 就可以实现QTabBar横向
此方法更适合已经存在的QTabWidget编辑好tab里面的内容。
注意:
1.如果east和west时候,显示不完,出现...,需要设置elidemode为ElideNone。
2.不能通过样式表设置QTabBar::tab的样式。
参考博客:https://blog.csdn.net/wojiaoanchao/article/details/78911891
3.分享一套代码,如下图:
代码链接:https://download.csdn.net/download/weixin_41882459/12774054
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。