QSS【QT】

文章目录

QSS

设置样式的时候,是可以指定某个控件来设置的。

指定控件之后,此时的样式就会针对这个指定的控件,也会针对子控件生效

复制代码
  ui->pushButton_2->setStyleSheet("QPushButton { color: green; }");

QPushButton 没有子控件

复制代码
    this->setStyleSheet("QPushButton {color : red ; } ") ; //会针对this的子控件也生效.

既是要考虑到子控件,也是要和选择器相关的.

  1. 如果设置了全局样式,然后在某个控件里又设置了其他的样式,会出现什么问题?

​ 全局样式,和在某个控件里又设置的其他的样式,这两个样式会"叠加"起来

2 如果设置了全局样式,在某个控件里设置的样式和全局样式冲突了,会出现什么问题?

当全局样式和局部样式冲突的时, 局部样式的优先级是更高的。覆盖了对应的全局样式

场景:实际开发中,就可以在全局样式中设置比较通用的样式,统一整个程序的界面风格.如果需要针对某个控件进行微调,可以使用局部样式来做出调整.

把样式代码拎出来,放到单独的文件中。

后续可以直接让 C++ 代码来读取并加载文件内容

  1. 创建 qrc 文件,通过 qrc 管理样式文件。
  2. 创建单独的 qss 文件,把这样的文件放到 qrc 中
  3. 编写 C++ 代码,读取 qss 文件中的内容,并设置样式。

例如:

QT: QT - Gitee.com

id选择器 & 类型选择器

当类型选择器和 id 选择器选中同一个控件时,并且设置的样式是冲突的,此时,id 选择器的优先级更高

例如:

qss_4 · beihangya/QT - 码云 - 开源中国

如果不冲突,两种样式会叠加

给QCombox的子控件加上图标

qss_6 · beihangya/QT - 码云 - 开源中国

伪类选择器

伪类选择器,选中的是控件的"状态""符合一定状态条件"的控件

qss_7 · beihangya/QT - 码云 - 开源中国

盒子模型

创建一个 resource.qrc 文件,并导入图片

qss_10 · beihangya/QT - 码云 - 开源中国

复制代码
QCheckBox{
	font-size : 20px;
}
QCheckBox::indicator{
 	width: 20px ;
	height : 20px ;
}
QCheckBox::indicator:unchecked{
		image:url(:/new/prefix1/doge.png);
}
QCheckBox::indicator:unchecked:hover{
		image:url(:/new/prefix1/rose.jpg);
}
QCheckBox::indicator:unchecked:pressed{
		image:url(:/image/doge.png);
}

自定义单行输入框

qss_12 · beihangya/QT - 码云 - 开源中国

自定义列表框 ,使用渐变色

复制代码
qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #FAFBFE, stop: 1 #DCDEF1)

x1: 起点的横坐标

y1: 起点的纵坐标

x2: 终点的横坐标

y2: 终点的纵坐标

stop: 0 起始颜色

stop: 1 结束颜色

例如:

从左到右的渐变

x1: 0 , y1: 0 , x2: 1 , y2: 0

从上到下的渐变

x1: 0 ,y1: 0 , x2: 0 ,y2: 1

对角线方向从左上到右下的渐变

x1: 0 ,y1: 0 ,x2: 1 , y2: 1

需求:自定义菜单栏

qss_14 · beihangya/QT - 码云 - 开源中国

需求:自定义登录界面 , 并且给登录界面设置背景图

如何设置背景?

解决方案:

1、直接给 QWidget 顶层窗口设置背景图。

问题 :但是 Qt 中存在限制,直接给顶层窗口设置背景会失效。

问题原因:(原因暂时不可考)

2、可以给上述控件外头套上一个和窗口一样大小的 QFrame 控件。(该方案可以解决设置背景)

QFrame 也是 QWidget 的一个子类。

qss_15 · beihangya/QT - 码云 - 开源中国

Qt中设置背景图, 有两个方式

1、background-image 属性 ,适用场景 :图片固定大小

2、border-image 属性. 适用场景 :背景会自动跟随控件的大小变化

相关推荐
CodeByV10 小时前
【C++】继承
开发语言·c++
权泽谦10 小时前
用 Python 做一个天气预报桌面小程序(附源码 + 打包与部署指导)
开发语言·python·小程序
ftpeak10 小时前
《Rust+Slint:跨平台GUI应用》第八章 窗体
开发语言·ui·rust·slint
森语林溪10 小时前
大数据环境搭建从零开始(十七):JDK 17 安装与配置完整指南
java·大数据·开发语言·centos·vmware·软件需求·虚拟机
lsx20240611 小时前
HTML 音频(Audio)详解
开发语言
woshihonghonga11 小时前
【动手学深度学习】
开发语言·python
威风的虫11 小时前
ES6 数组方法:告别循环,拥抱函数式编程
开发语言·前端·javascript
码界筑梦坊11 小时前
240-基于Python的医疗疾病数据可视化分析系统
开发语言·python·信息可视化·数据分析·毕业设计·echarts
2301_8035545211 小时前
C++ 锁类型大全详解
开发语言·c++
wuwu_q11 小时前
用通俗易懂方式,详细讲讲 Kotlin Flow 中的 map 操作符
android·开发语言·kotlin