QSS样式设置及语法规则

news2024/9/22 13:29:53

QSS(Qt Style Sheets)是Qt的一个功能强大的样式表语言。它类似于CSS(Cascading Style Sheets),可以用于定义和控制应用程序的外观和样式。QSS可以应用于Qt部件(Widgets)和绘制元素,以定制和美化用户界面。

使用QSS,开发人员可以轻松地更改应用程序的颜色、字体、大小、背景等视觉属性,以及控制各种部件的布局和样式。QSS还允许开发人员在状态或事件触发时改变部件的外观,以实现动态的交互效果。

QSS有以下特点:

  1. 语法简单易学:QSS的语法与CSS类似,具有很高的学习曲线。
  2. 高度可定制:开发人员可以根据自己的需求,通过QSS定制出独特的应用程序外观,以满足用户的个性化需求。
  3. 跨平台:QSS是Qt的一部分,因此可以在各种不同的平台上使用,并且在不同的Qt版本之间保持兼容。
  4. 功能强大:通过QSS,可以实现丰富多样的样式效果,包括渐变、阴影、边框、圆角等。

总之,QSS是Qt开发人员的一个有用工具,可以通过定义和应用样式表,轻松地改变应用程序的外观和样式。它使开发人员能够创建出个性化的用户界面,提供更丰富、更吸引人的用户体验。

通过ui界面设置按钮样式

在这里插入图片描述

通过局内代码设置按钮样式

// 通过代码设置按钮悬停时的样式
ui->pushButton_2->setStyleSheet("QPushButton:hover {"
                                    "background-color: #ff55ff;"
                                "}");

通过QSS文件设置

1、添加资源文件

1、打开Qt Creator,并打开你的项目。
2、在项目树中,右击项目文件夹或者需要添加资源文件的子文件夹,选择"Add New"
或者"Add Existing Files..."。
3、在对话框中,选择"Qt" -> "Qt Resource File",然后点击"Choose"按钮。
4、弹出的对话框中,输入资源文件的名称,例如"resources",点击"Next"按钮。
5、在下一个对话框中,点击"Finish"按钮。
6、添加资源文件后,会在项目文件夹中生成一个新的.qrc文件。双击打开该文件,可以看到
Qt Creator的资源编辑器界面。
7、在资源编辑器中,可以通过拖放方式将需要添加的文件添加到资源文件中。也可以使用右击菜单
选择"Add Files"或"Add Directory"命令来添加文件或目录。
8、添加完所有需要的资源文件后,保存资源文件。
9、在代码中使用资源文件中的资源时,可以使用路径形式来访问,例如
使用:/resources/image.png来访问资源文件中的图片。
10、最后,重新构建并运行项目,资源文件会被自动编译和链接到生成的可执行文件中。

2、创建一个.qss文件,内容如下:

/* 设置窗口背景颜色和字体样式 */
QWidget {
	// 背景色为绿色
    background-color: #53c23c;
    font-family: Arial;
}

/* 鼠标悬停时按钮的样式 */
// 名称为pushButton的按钮的样式
QPushButton#pushButton:hover {
	// 蓝色
    background-color: #6b6bdd;
    border-color: #0056b3;
}

/* 按钮按下时的样式 */
// 名称为pushButton的按钮的样式
QPushButton#pushButton:pressed {
	// 黑色
    background-color: #000000;
    border-color: #002d5c;
}

/* 设置标签的颜色和字体样式 */
QLabel {
    color: #333;
    font-size: 16px;
}

3、将qss文件导入项目后

添加资源文件后的目录结构为
在这里插入图片描述
使用时的路径访问为

":/Style.qss"

4、代码中使用QSS文件

	QFile qssFile(":/C:\\Users\\zh'n\\Desktop/Style.qss");
    qssFile.open(QFile::ReadOnly | QFile::Text);
    QString qss = qssFile.readAll();

		// 给ui界面中名称为pushButton设置样式
    ui->pushButton->setStyleSheet(qss);
    // 设置整个widget的样式
    setStyleSheet(qss);
		
		// 通过代码的方式设置样式,不是通过qss文件
    ui->pushButton_2->setStyleSheet("QPushButton:hover {"
                                    "background-color: #ff55ff;"
                                "}");

    qssFile.close();

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/697608.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

集合专题----Map篇

1、Map 接口和常用方法 (1)Map 接口实现类的特点 ① Map与Collection并列存在(即平行关系)。Map用于保存具有映射关系的数据:Key-Value; ② Map 中的 key 和 value 可以是任何引用类型的数据,…

先平移再旋转和先旋转再平移的区别

对于一个刚体,以汽车为例,先旋转再平移和先平移再旋转有没有区别要看这个平移旋转是以什么坐标系为基准 如果平移和旋转都以小车坐标系为基准,二者是有区别的 如果平移旋转以世界坐标系为基准,二者是没有区别的 看图就明白了 所…

v8-tc39-ecma262:concat,不只是合并数组

如上图,解释如下: 如果是对象o,转换为对象新建数组A设n0,用于最后赋值给A,确保A的长度正确预先把值设置到items(这里不知何意?)循环items,设置元素为E E是否可展开如果可展开 有len下标,则获取…

LLM - 第2版 GLM 中文对话模型 ChatGLM2-6B 服务配置 (2)

欢迎关注我的CSDN:https://spike.blog.csdn.net/ 本文地址:https://blog.csdn.net/caroline_wendy/article/details/131445696 ChatGLM-6B v1 工程:基于 ChatGLM-6B 模型搭建 ChatGPT 中文在线聊天 (1)ChatGLM2-6B v2 工程:第2版 …

react umi中使用svg线上图片不加载问题

参考链接&#xff1a; https://www.jianshu.com/p/c927122a6e82 前言&#xff1a; 在react项目中&#xff0c;我们本地通过img标签的src使用svg图片是可以加载的&#xff0c;但是发布到线上图片加载不出来。 import stopImg from /images/stop.svg; <img src{stopImg }/&…

Transformer时间序列:PatchTST引领时间序列预测进

Transformer时间序列&#xff1a;PatchTST引领时间序列预测进 引言为什么transformer框架可以应用到时间序列呢统计学模型深度学习模型 PatchTSTPatchTST模型架构原理。通道独立性Patchingpatching的优点Transformer编码器 利用表示学习改进PatchTST使用PatchTST模型进行预测初…

深入理解 Golang: 聚合、引用和接口类型的底层数据结构

Go 中有基础类型、聚合类型、引用类型和接口类型。基础类型包括整数、浮点数、布尔值、字符串&#xff1b;聚合类型包括数组、结构体&#xff1b;引用类型包括指针、切片、map、function、channel。在本文中&#xff0c;介绍部分聚合类型、引用类型和接口类型的底层表示及原理。…

如何在Microsoft Excel中快速筛选数据

你通常如何在 Excel 中进行筛选?在大多数情况下,通过使用自动筛选,以及在更复杂的场景中使用高级过滤器。 使用自动筛选或 Excel 中的内置比较运算符(如“大于”和“前10项”)来显示所需数据并隐藏其余数据。筛选单元格或表范围中的数据后,可以重新应用筛选器以获取最新…

数据结构与算法基础-学习-25-图之MST(最小代价生成树)之Prim(普利姆)算法

一、生成树概念 1、所有顶点均由边连接在一起&#xff0c;但不存在回路的图。 2、一个图可以有许多棵不同的生成树。 二、生成树特点 1、生成树的顶点个数与图的顶点个数相同。 2、生成树是图的极小连通子图&#xff0c;去掉一条边则非连通。 3、一个有n个顶点的连通图的生…

stm32f103c8t6移植U8g2

U8g2代码下载&#xff1a; https://github.com/olikraus/u8g2 1&#xff0c;准备一个正常运行的KEIL5 MDK模板 2&#xff0c;下载u8g2的源码和 u8g2的STM32实例模板 源码: https://github.com/olikraus/u8g2 STM32实例模板: https://github.com/nikola-v/u8g2_template_stm32f…

100天精通Golang(基础入门篇)——第11天:深入解析Go语言中的切片(Slice)及常用函数应用

&#x1f337; 博主 libin9iOak带您 Go to Golang Language.✨ &#x1f984; 个人主页——libin9iOak的博客&#x1f390; &#x1f433; 《面试题大全》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33a; &#x1f30a; 《I…

期望最大化注意力网络 EMANet

论文&#xff1a;Expectation-Maximization Attention Networks for Semantic Segmentation Github&#xff1a;https://github.com/XiaLiPKU/EMANet ICCV2019 oral 论文提出的期望最大化注意力机制Expectation- Maximization Attention (EMA)&#xff0c;摒弃了在全图上计算注…

再述时序约束

再述时序约束 一、为什么要加时序约束&#xff1f;二、时序分析是什么&#xff1f;三、时序分析的一些基本概念三、 时序分析的一些基本公式 一、为什么要加时序约束&#xff1f; 一次笔者在调试HDMI输出彩条&#xff0c;出现彩条时有时无现象&#xff0c;笔者视频输出芯片的驱…

leecode-数组多数-摩尔投票法

题目 题目 分析 最开始思路&#xff1a;排序&#xff0c;然后取nums[n/2]&#xff0c;但是时间复杂度不过关。 摩尔投票法&#xff0c;学到了&#xff01; 代码 class Solution { public:int majorityElement(vector<int>& nums) {//摩尔投票int cnt0;int targ…

计算机二级c语言题库

计算机C语言二级考试&#xff08;60道程序设计&#xff09; 第1道 请编写一个函数fun,它的功能是:将ss所指字符串中所有下标为奇数位置上的字母转换成大写&#xff08;若该位置上不是字母&#xff0c;则不转换&#xff09;。 例如&#xff0c;若输入"abc4EFG"&…

OpenCV学习笔记 | ROI区域选择提取 | Python

摘要 ROI区域是指图像中我们感兴趣的特定区域&#xff0c;OpenCV提供了一些函数来选择和提取ROI区域&#xff0c;我们可以使用OpenCV的鼠标事件绑定函数&#xff0c;然后通过鼠标操作在图像上绘制一个矩形框&#xff0c;该矩形框即为ROI区域。本文将介绍代码的实现以及四个主要…

opencv编译

文章目录 一、编译前工作二、编译安装1、Windows2、Linux 一、编译前工作 进入下载页面https://github.com/opencv/opencv&#xff0c;下载指定.tar.gz源码包&#xff0c;例如&#xff1a;opencv-4.7.0.tar.gz。解压到指定目录。 二、编译安装 opencv构建时&#xff0c;需要…

使用docker搭建hadoop集群

1.下载安装docker 2.启动docker 3.配置docker镜像 4.获取hadoop镜像 5.拉取hadoop镜像 6.运行容器 7.进入容器 8.配置免密 9.格式化节点 10.启动节点 11.查看节点信息 (img-CBr9VbGk-1687962511910)] 11.查看节点信息

javascript原型、原型链、继承详解

一、原型和原型链的基本概念 在JavaScript中&#xff0c;每个对象都有一个原型对象&#xff08;prototype&#xff09;。原型对象就是一个普通的对象&#xff0c;在创建新对象时&#xff0c;可以将该对象作为新对象的原型。原型对象可以包含共享的属性和方法&#xff0c;这些属…

Appium自动化-ADB连接手机提示unauthorized

目录 开头&#xff1a; 问题&#xff1a; 调研&#xff1a; 重启大法 终极大法 总结&#xff1a; 开头&#xff1a; 当使用ADB&#xff08;Android Debug Bridge&#xff09;连接手机时&#xff0c;如果提示"unauthorized"&#xff08;未授权&#xff09;错误&a…