Qt QPalette、styleSheet使用总结

本文总结了Qt中的QPalette调色板和Style Sheets样式表的使用,包括QPalette的setBrush和setColor函数,以及QSS的背景色、字体颜色、边框等设置方法。还介绍了在QTextEdit中应用样式时遇到的问题和解决方案,以及样式设置的注意事项和不同方式,如UI界面设置、程序添加和QSS文件添加。
摘要由CSDN通过智能技术生成

Qt css样式大全請參考:https://blog.csdn.net/chenyijun/article/details/79766029

概述
Qt的样式/颜色机制主要有两个体系,一个是用调色板(QPalette) 另一个是样式表Style Sheets。在Qt4之前 Qt的图形化组件的各种颜色(前景色、背景色、文本色、选中色、非选中色等)有不同的函数,例如setBackgroundColor函数。但在Qt4之后这些函数不在使用,而是由QPalette调色板管理,当然样式表(Style Sheets)也是可以的,在Qt4.5以后Qt样式表已经完美支持Mac系统了,所有也是个不错的选择,特别是对有CSS使用经验的人来说。

这样对于普通的图形化控件(如QWidget)的颜色管理就有两种方式,大家根据个人喜欢使用, 但调色板说明文档不够详细,大家使用时注意。


1.调色板(QPalette)
调色板顾名思义就是设置好颜色在要求的地方进行填充。调色板有两个最重要的函数:setBrush 和 setColor
1.1 setBrush
void QPalette::setBrush ( ColorGroup group, ColorRole role, const QBrush & brush );

setBrush 即为画刷,就是设置好刷墙的刷子,它要设置三个问题:1.什么时候刷,2.在哪刷,3.刷成什么样?

1.1.1 什么时候刷QPalette::ColorGroup
QPalette::Disabled
QPalette::Active
QPalette::Inactive
QPalette::NormalActive
大部分情况下QPalette::Active就可以。

1.1.2 在哪刷QPalette::ColorRole

这个是最重要的参数,就是决定是刷背景色还是前景色,还是文本色等等,Assistant中有详细介绍,下面略作说明:
QPalette::Window   通常指窗口部件的背景色;   
QPalette::Background
QPalette::WindowText   通常指窗口不见的前景色;
QPalette::Foreground
QPalette::Base         指文本输入窗口部件(比如QTxtEdit,QLinedit等)的背景色.
QPalette::AlternateBase
QPalette::ToolTipBase
QPalette::ToolTipText
QPalette::Text        与QPalette::Base一块使用,指文本输入窗口部件的前景色;
QPalette::Button  指按钮窗口部件的背景色;
QPalette::ButtonText  指按钮窗口部件的前景色.
QPalette::BrightText 

1.1.3 刷成什么样QBrush

画刷QBrush 也是个功能强大的东东,鉴于你可能不怎么使用,你只知道能设置颜色就行。

//注意要先调用setAutoFillBackground
textEdit->setAutoFillBackground(true);
QPalette palette;
//设置QTextEdit文字颜色
palette.setBrush(QPalette::Active, QPalette::Text, QBrush(Qt::yellow));
//设置QTextEdit背景色
palette.setBrush(QPalette::Active, QPalette::Base, QBrush(Qt::red));
textEdit->setPalette(palette);

1.2 setColor
void QPalette::setColor ( ColorGroup group, ColorRole role, const QColor & color );
虽然setColor参数和setBrush差不多,只是最后一个参数更简洁,直接设置好颜色就行。

1.3说明这就是调色板QPalette 的实现了,特别说明的一点是在QTextEdit使用是遇到了点小问题。初始化时使用了上面的那段代码,但想中途改变QTextEdit的背景色时,在调用同样方式确没有效果,多次测试没找到原因(难道是bug?),所有采用了下面这种方法:样式表(Style Sheets)


2. QSS语法

background-color:rgb(6, 168, 255);    背景色

color:red;                字体颜色

border-radius:5px;            边框圆角半径

border:2px solid green;         边框2像素,实现,绿色

font:10pt;               字体大小10

设置QSS方法

方法一:UI界面设置

举例,在设计师界面拖入一个QPushButton,右击这个按钮,选择改变样式表,就会弹出添加样式的窗口;

或者,左键选中这个按钮,在右侧的属性对话框中找到StyleSheet属性,点击…按钮也可打开样式表窗口,如下图所示
在这里插入图片描述

在打开的编辑样式表窗口直接输入“样式语句”,点击应用apply即可实时看到样式的效果,如下图所示:
在这里插入图片描述

编辑样式表这个窗口可以实时提示,我们输入的qss语句语法是否正确,如果正确会在左下角提示:有效样式表,当然,这个语法检查功能非常有限,只能检查语法的格式,例如是否缺少了大括号、是否漏了冒号、分号。

注意事项
1、这里有一点比较另类,设定背景颜色background-color时,必须要同时把设置一下边框属性:如边框圆角border-radius、边框粗细等,否则背景色无法生效。

2、如上图所示,样式表可以用大括号限定作用的控件类型,比如QPushButton{ },如果不用大括号限定控件类型,那么该控件的所有子控件都会显示为父控件的样式,最典型的例子,使用容器类控件时,

例如QGroupBox,我们不用QGroupBox{ }限定qss语句的作用范围,而是直接设置其样式,那么该容器中的任何子控件(按钮、单选框、label等)都会显示为QGroupBox的样式,如下图所示:
在这里插入图片描述

由此我们还可以联想到,主窗口是所有控件的父控件,

(1)如果我们设置了主窗体的样式,而不指定作用范围,那么窗体内的所有控件都会按照主窗体的设置的样式来显示;

(2)如果我们在主窗体中设置样式时指定作用范围为QPushButton,那么该窗体内的所有QPushButton就都会显示为所设置的样式。

(3)如果父控件和子控件都设置了样式,那么子控件就按照自己的样式来显示,这是覆盖机制,因为父控件总是在子控件之前构造,子控件在构造时,会把原先的设置给覆盖掉。

方法二:程序添加

每一个控件都有setStyleSheet(const QString &styleSheet)方法,样式字符串直接传参即可,例:

ui.pushButton1->setStyleSheet("QPushButton{background-color: white;  color: rgb(100, 100, 100) ;}");

方法三:通过QSS文件添加

新建文件StyleSheet.qss文件,添加内容如下:
复制代码

/**按钮静止无操作样式**/
QPushButton 
{
   
    background-color:rgb(255,255,255); 
    color:rgb(6,168,255); 
    border:2px solid rgb(6,168,255); 
    font-size:14px; 
    border-radius:10px;
}

/**鼠标悬停在按钮**/
QPushButton:hover
{
   
    background-color: rgb(212,243,255); 
    color:rgb(6,168,255);
    border:2px solid rgb(6,168,255); 
    border-radius:14px;
}

/**鼠标按下按钮**/
QPushButton:pressed
{
   
    background-color: rgb(175,232,255); 
    color:white; 
    border:2px solid rgb(6,168,255); 
    border-radius:14px;
}

读取配置文件设置指定按钮样式:

StyleDialog::StyleDialog(QWidget *parent)
    : QDialog(parent)
{
   
    ui.setupUi(this);
    QString strStyle = ReadQssFile("StyleSheet.qss");
    ui.pushButton2->setStyleSheet(strStyle);
}

StyleDialog::~StyleDialog()
{
   
}


QString StyleDialog::ReadQssFile(const QString& filePath)
{
   
    QString strStyleSheet = ""
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值