设置QTabWidget在不同方向上的文字均水平显示。有两种方法,如下:
1、设置不同Position,tabBar文字均水平显示
QTabWidget设置在设置Position为East或者West时,文字方向默认会从下到上显示。先通过以下方法实现tabBar更改方向,但文字始终垂直显示。
方法1:通过继承QTabWidget来实现
用到函数:
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
方法2: 重绘代码
#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