Qt界面美化之Qt Style Sheets

Qt style sheet 简称QSS

style sheet可以在代码中单独对某个控件使用,例如:

labelLEDLIN = new QLabel("",this);
labelLEDLIN->setFixedSize(36,36);
labelLEDLIN->setStyleSheet("background-color:red;border-radius:18px;color:white;font:12pt;border: 3px solid #87B2D5;");
// 设置label的样式:背景色红色  边框圆角半径为长宽的一半  字体颜色   字体大小 边框宽度和颜色
// 这样就把label控件设置成了红色的圆形,可以做LED指示灯。

 style sheet 也可以直接作用在窗口,按类型来美化,如下:

//main.cpp#include "mywidget.h"#include <QApplication>int main(int argc, char *argv[])
{QApplication a(argc, argv);MyWidget w;const QString qssStyle ="\QPushButton {\border: 2px solid rgba(88, 166,220 , 90%);\border-radius: 5px;\background-color:qlineargradient( x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #9BC7FD, stop: 0.4 #3390D1 ,stop: 1.0 #9BC7FD);\}\QPushButton:pressed {\border-style: inset;\}\QComboBox {\border: 2px solid #87B2D5;\border-radius: 5px;\background-color: rgba(228, 248, 255, 70%);\}\QTextBrowser{\border: 2px solid #87B2D5;\border-radius: 5px;\background-color: rgba(255, 255, 255, 70%);\}\QLineEdit {\border: 2px solid #72B3F3;\border-radius: 5px;\background-color: rgba(255, 255, 255, 70%);\}\QGroupBox {\border-color: #FFFFFF;\border-width: 1px;\border-style: solid;\margin-top: 2ex;\}\QGroupBox::title {\subcontrol-origin: margin;\subcontrol-position: top left;\left: 10px;\margin-left: 2px;\padding: 0px;\}";w.setStyleSheet(qssStyle);w.show();return a.exec();
}//把样式都设置在qssStyle 这个字符串里,示例是按控件类型,也可以单独指定某个控件。
//然后在窗口显示之前给窗口设置style sheet 就可以了,w.setStyleSheet(qssStyle);

 基本语法

基本语法规则
width:12px; //设置宽度 单位像素
height:40px //设置高度
min-width:65px; //最小宽度 有些时候设置width无效可以尝试设置min-width
min-height:12px; //最小高度
max-width:12px;
max-height:12px;
/设置背景颜色 四种颜色表示方式/
background-color:rgb(255,255,255);
background-color:rgbs(255,255,255,30); //最后一个参数是透明度 0~255
background-color:yellow //常用颜色名(17种标准色与130种其他颜色) 更多见附录
background-color:#FF0000colo:rgb(255,255,255); //前景色 文本颜色
color: #F5F5F5; //前景(文本)颜色
color: qlineargradient(); //前景(文本)颜色:线性渐变
color: qradialgradient(); //前景(文本)颜色:辐射渐变
color: qconicalgradient(); //前景(文本)颜色:梯形渐变font-size:20px //字体大小
font-family:黑体 //字体选择 更多字体见附录margin: 14px 18px 20px 18px; //外边距 顺序上右下左
margin-top: 14px;
margin-right: 18px;
margin-bottom: 20px;
margin-left: 18px;padding: 4px; //内边距 顺序上右下左 只写一个参数代表相等
padding-left: 5px; /* 文字左边距 /
padding-right: 10px; / 文字右边距 /
padding-top: 3px; / 文字顶边距 /
padding-bottom: 3px; / 文字底边距 */border:3px solid red //边框—可以分开设置 solid 实线 dotted 点状边框 none无边框 dashed 虚线
border—四条边相同样式
border-style
border-top-style
border-right-style
border-bottom-style
border-left-styleborder-width 上 右 下 左 ----- 边框宽度 //3px 边框像素—宽度-单位:像素,也可以em,1em=16px
border-top-width
border-right-width
border-bottom-width
border-left-widthborder: 1px solid #FDBC03; /* 边框:宽度 颜色*/
border-image:url(boder.png) 4 8 12 16; /* 边界图 切线 /
border-radius: 4px; /边框圆角半径 /
border-top-left-radius: ; / 角弧度:左上角/
border-top-right-radius: ; / 角弧度:右上角*/
border-bottom-left-radius: ; /* 角弧度:左下角*/
border-bottom-right-radius: ; /* 角弧度:右下角*/double 双线 groove 定义3D凹槽边框。其效果取决于border-color的值
ridge 定义3D垄状边框。其效果取决于 border-color的值
inset 定义3D inset边框。其效果取决于 border-color的值
outset 定义3D outset边框。其效果取决于 border-color的值border-color: //边框颜色 上 右 下 左
border-top-color
border-right-color
border-bottom-color
border-left-color/伪状态列表/
:checked //button部件被选中
:unchecked //button部件未被选中
:disabled //部件被禁用
:enabled //部件被启用
:focus //部件获得焦点
:hover //鼠标位于部件上
:indeterminate //checkbox或radiobutton被部分选中
:off //部件可以切换,且处于off状态
:on //部件可以切换,且处于on状态
:pressed //部件被鼠标按下/子部件列表/
::down-arrow //combo box或spin box的下拉箭头
::down-button //spin box的向下按钮
::drop-down //combo box的下拉箭头
::indicator //checkbox、radio button或可选择group box的指示器
::item //menu、menu bar或status bar的子项目
::menu-indicator //push button的菜单指示器
::title //group box的标题
::up-arrow //spin box的向上箭头
::up-button //spin box的向上按钮


 

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

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

相关文章

UNI-APP_nvue踩坑

踩坑1 1.nvue里面的样式不可以用预编译语言&#xff0c;只能用css&#xff1b; 2.不能随心所欲地使用选择器&#xff0c;nvue只支持单类选择器&#xff08;不可以使用交集选择器和后代选择器&#xff0c;但可以使用并集选择器&#xff09;&#xff1b; 3.div是容器&#xff0c…

YOLO V1学习笔记

为什么要学YOLOV1_哔哩哔哩_bilibili 这个视频讲解的很好&#xff0c;建议在看这个之前看看卷积神经网络&#xff0c;会对卷积后的结果理解更加深刻一点。 一 背景 目标检测分为单阶段和两阶段模型。 之前的目标检测DPM、R-CNN、Fast-RCNN、Faster-RCNN都是双阶段模型&…

ElasticSearch集群架构实战及其原理剖析

ES集群架构 为什么要使用ES集群架构 分布式系统的可用性与扩展性&#xff1a; 高可用性 服务可用性&#xff1a;允许有节点停止服务&#xff1b;数据可用性&#xff1a;部分节点丢失&#xff0c;不会丢失数据&#xff1b; 可扩展性 请求量提升/数据的不断增长(将数据分布…

用android studio调试react native中的原生代码(windows+android)

要用Android Studio调试React Native原生代码&#xff0c; 1. 需要先在终端中运行react-native start命令启动React Native服务器。 2. 然后&#xff0c;在Android Studio中打开你的React Native项目&#xff08;\android\build.gradle&#xff09;&#xff0c;连接你的设备或…

Salesforce创建一个页面,能够配置各种提示语,而不需要修改代码

在Salesforce中创建一个页面&#xff0c;并使其能够配置各种提示语&#xff0c;可以使用自定义设置、自定义对象或自定义标签等方法来实现。以下是一种常见的方法&#xff1a; 自定义对象或自定义设置&#xff1a;您可以创建一个自定义对象或自定义设置来存储各种提示语的信息。…

[极客大挑战 2019]LoveSQL 1

题目环境&#xff1a;判断注入类型是否为数字型注入 admin 1 回显结果 否 是否为字符型注入 admin 1 回显结果 是 判断注入手法类型 使用堆叠注入 采用密码参数进行注入 爆数据库1; show database();#回显结果 这里猜测注入语句某字段被过滤&#xff0c;或者是’;被过滤导致不能…

linux jdk配置

1.下载jdk &#xff0c;以jdk1.8为例子 Java Downloads | Oracle JDK 8 Update Release Notes (oracle.com) 2.配置环境变量 1.下载相关jdk版本&#xff0c;执行以下命令安装jdk tar -zxvf jdk-8u144-linux-x64.tar.gz 2.编辑命令 vi /etc/profile 3.在最后加入下面配置 e…

硬件测试(二):波形质量

一、信号质量测试 信号在传输的过程中&#xff0c;一般不是标准的矩形波信号&#xff0c;信号质量测试即通过示波器测试单板硬件的数字信号和模拟信号的各项指标&#xff0c;包括电源、时钟、复位、CPU小系统、外部接口&#xff08;USB、网口、串口&#xff09;、逻辑芯片(CPLD…

【C++】异常【完整版】

目录 1.C语言传统的处理错误的方式 2. C异常概念 3. 异常的使用 3.1 异常的抛出和捕获 3.2 异常的重新抛出 3.3异常安全 3.4 异常规范 4.自定义异常体系 5.C标准库的异常体系 6.异常的优缺点 1.C语言传统的处理错误的方式 传统的错误处理机制&#xff1a; 1. 终止程序…

acwing算法基础之数据结构--trie算法

目录 1 基础知识2 模板3 工程化 1 基础知识 trie树算法&#xff0c;也叫作字典树算法。 用处&#xff1a;用来高效存储和查找字符串集合的数据结构。 &#xff08;一&#xff09; 定义变量。 const int N 1e5 10; int son[N][26], cnt[N], idx; char str[N];&#xff08;二…

(论文阅读13/100)R-CNN minus R

文献阅读笔记 简介 题目 R-CNN minus R 作者 Karel Lenc Andrea Vedaldi 原文链接 https://arxiv.org/pdf/1506.06981.pdf 关键词 Null 研究问题 proposal generation在基于CNN的探测器中的作用&#xff0c;以确定它是否是一个必要的建模组件。 R-CNN留下的几个有趣…

“1-5-15”原则:中国联通数字化监控平台可观测稳定性保障实践

一分钟精华速览 “只知道系统有问题&#xff0c;但是找不到问题到底出在哪里”&#xff0c;这几乎是大家都面临过、或正在面临的问题。用户在投诉&#xff0c;但是我的指标都是正常的&#xff0c;到底是哪一环出问题了&#xff1f; 本文详细介绍了中国联通在智能运维领域的应用…

Asterisk Ubuntu 安装

更新环境 sudo apt update sudo apt install wget build-essential git autoconf subversion pkg-config libtool sudo contrib/scripts/get_mp3_source.sh A addons/mp3 A addons/mp3/common.c A addons/mp3/huffman.h A addons/mp3/tabinit.c A addons/mp3/Ma…

3D医学三维技术影像PACS系统源码

一、系统概述 3D医学影像PACS系统&#xff0c;它集影像存储服务器、影像诊断工作站及RIS报告系统于一身,主要有图像处理模块、影像数据管理模块、RIS报告模块、光盘存档模块、DICOM通讯模块、胶片打印输出等模块组成&#xff0c; 具有完善的影像数据库管理功能&#xff0c;强大…

Leetcode76最小覆盖子串

思路&#xff1a;滑动窗口思想 1. 滑动窗口是什么&#xff1a;用一个滑动窗口为覆盖目标子串的字符串 2.怎么移动窗口&#xff1a;当不满足覆盖时右指针移动扩大范围&#xff0c;当覆盖了就移动左指针缩减范围直到再次不覆盖 3. 怎么判断是否覆盖&#xff1a;这里使用两个哈…

接口自动化测试难点:数据库验证解决方案 百分之90人不知道

接口自动化中的数据库验证&#xff1a;确保数据的一致性和准确性 接口自动化测试是现代软件开发中不可或缺的一环&#xff0c;而数据库验证则是确保接口返回数据与数据库中的数据一致性的重要步骤。本文将介绍接口自动化中的数据库验证的原理、步骤以及示例代码&#xff0c;帮…

Flutter 06 动画

一、动画基本原理以及Flutter动画简介 1、动画原理&#xff1a; 在任何系统的Ul框架中&#xff0c;动画实现的原理都是相同的&#xff0c;即&#xff1a;在一段时间内&#xff0c;快速地多次改变Ul外观&#xff1b;由于人眼会产生视觉暂留&#xff0c;所以最终看到的就是一个…

CCS3列表和超链接样式

在默认状态下&#xff0c;超链接文本显示为蓝色、下画线效果&#xff0c;当鼠标指针移过超链接时显示为手形&#xff0c;访问过的超链接文本显示为紫色&#xff1b;而列表项目默认会缩进显示&#xff0c;并在左侧显示项目符号。在网页设计中&#xff0c;一般可以根据需要重新定…

切换win11 账户后,git报错

问题场景&#xff1a; 切换win11 账户后&#xff0c;git报错 git pull 报错&#xff1a; fatal: detected dubious ownership in repository at D:xxxxx D:/0xxxxxx is owned by: xxxxxxxxxxxxxxxxx but the current user is: xxxxxxxxxxxxxxxxxx To add an exception for this…

ESP-07S烧写固件记录

一&#xff0c;固件版本。 下面是官方默认AT指令版本&#xff0c;ESP-07S 的flash大小是4MB。 AT固件汇总 | 安信可科技 (ai-thinker.com) 二&#xff0c;烧录工具。 开发工具清单 | 安信可科技 (ai-thinker.com) 三&#xff0c;下载工具及连线。 使用USB转串口工具。 四&am…