一、前言

本篇文章没有什么技术和精华，仅作为记录一下按键的qss配置风格，目前用了3种风格，后续有更好看的也会更新在本博客中

二、环境

qt5.7

windows

三、正文

按键qss风格配置了按键常规样式、失能样式、可选情况下的未选择样式、鼠标悬停honver样式、鼠标按下未抬起样式

风格1：

可选择按键：

qss:

QPushButton:checked{
color: #ffffff;
background-color: rgb(55, 156, 212);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:checked:hover{
color: #ffffff;
background-color: rgb(43, 124, 168);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radiu:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:checked:pressed{
color: #ffffff; background-color: rgb(32, 94, 127);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:!checked{
color: #ffffff;
background:#A0A6A9;
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:!checked:hover{
color: #ffffff;
background-color: rgb(140, 140, 140);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:!checked:pressed{
color: #ffffff;
background-color: rgb(100, 100, 100);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}QPushButton:!enabled{
color: #ffffff;
background-color: rgb(200, 200, 200);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}

不可选择按键：

qss：

QPushButton:enabled{
color: #ffffff;
background-color: rgb(55, 156, 212);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:enabled:hover{
color: #ffffff;
background-color: rgb(43, 124, 168);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radiu:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:enabled:pressed{
color: #ffffff;
background-color: rgb(32, 94, 127);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:!enabled{
color: #ffffff;
background-color: rgb(200, 200, 200);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}

风格2：

不可选择按键

qss：

QPushButton:enabled{
color: #ffffff;
background-color: rgb(110, 110, 110);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:enabled:hover{
color: #ffffff;
background-color: rgb(100, 100, 100);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radiu:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:enabled:pressed{
color: #ffffff;
background-color: rgb(60, 60, 60);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:!enabled{
color: #ffffff;
background-color: rgb(200, 200, 200);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}

风格3：

不可选择按键

qss：

QPushButton:enabled{
color: #ffffff;
background-color: rgb(110, 170, 100);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:enabled:hover{
color: #ffffff;
background-color: rgb(96, 148, 87);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radiu:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:enabled:pressed{
color: #ffffff; background-color: rgb(69, 106, 62);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:!enabled{
color: #ffffff;
background-color: rgb(200, 200, 200);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}

可选择按键：

qss：

QPushButton:checked{
color: #ffffff;
background-color: rgb(110, 170, 100);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:checked:hover{
color: #ffffff;
background-color: rgb(96, 148, 87);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radiu:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:checked:pressed{
color: #ffffff;
background-color: rgb(69, 106, 62);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:!checked{
color: #ffffff;
background:#A0A6A9;
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:!checked:hover{
color: #ffffff;
background-color: rgb(140, 140, 140);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QPushButton:!checked:pressed{
color: #ffffff;
background-color: rgb(100, 100, 100);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}QPushButton:!enabled{
color: #ffffff;
background-color: rgb(200, 200, 200);
border-right:0px solid #aaaaaa;
border-bottom:0px solid #aaaaaa;
border-left:0px solid #aaaaaa;
border-top:0px solid #aaaaaa;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}

四、结语

积少成多

qt-qss之按键样式相关推荐

1. Qt学习笔记之样式表

   一.概述 Qt的样式表是从Qt4.2开始引入的描述窗口部件外观的机制,类似于HTML的层叠样式表(Cascading Style Sheets,CSS).样式表在Qt的风格之上起作用(如果使用了样式表 ...

2. 在Qt Designer中使用样式表

   在Qt Designer中使用样式表 在Qt Designer中使用样式表 在Qt Designer中使用样式表 从Qt 4.2开始,可以使用样式表编辑器在Qt Designer中编辑样式表. 设置样 ...

3. Qt Creator指定代码样式设置

   Qt Creator指定代码样式设置 指定代码样式设置 指定代码样式设置 Qt Creator使用文件的MIME类型来确定用于打开文件的模式和编辑器.Qt Creator在C ++代码编辑器中以&qu ...

4. Qt利用setStyleSheet设置样式

   Qt利用setStyleSheet设置样式 Qt中设置按钮或QWidget的外观是,可以使用QT Style Sheets来进行设置,非常方便. setStyleSheet("font: b ...

5. Qt qss 九宫格

   Qt qss 九宫格 QPushButton{     border-image:url(:/button.png) 10 20 30 40;     border-top: 10px transpa ...

6. QT:QSS自定义QLineEdit实例

   QT:QSS自定义QLineEdit实例 QLineEdit 的框架是使用Box Model.设计的. 要创建带圆角的线编辑,我们可以设置: QLineEdit {border: 2px solid ...

7. qtcreator 界面样式_Office Ribbon 界面开发入门教程：如何用Qt实现Office界面样式

   Ribbon是什么? Ribbon是一种以面板及标签页为架构的用户界面.相当于它是一个收藏了命令按钮和图标的面板(把命令组织成一组"标签",每一组包含了相关的命令.每一个应用程序都 ...

8. Qt中解除按键在聚焦时键盘空格键可以控制

   Qt中解除按键在聚焦时键盘空格键可以控制,只允许鼠标左键可以点击按键 首先需要知道原因,为什么键盘上的空格键也可以点击按键? 根据Qt官网说明:A push button emits the sign ...

9. Qt QSS QSlider样式

   本文章主要学习QSlider样式 准备下面几张背景图片: 调小图标 .调大图标 ​.QSlider位置图标 ​QSlider划过的背景图标 ​.QSlider未划过的背景图标 ​最终效果图 自己创建一 ...

10. Qt QSS常用样式总结

    QTabWidget /**************************************************************************** * QTabWidge ...

最新文章

1. 《LoadRunner 没有告诉你的》之三——理发店模型
2. 为什么信不过AI看病？数据集小、可靠性差，AI医疗任重道远
3. 正确高效使用数据库不可不知的索引失效问题
4. Java 动态代理实践AOP
5. ltrim函数_常用基础函数
6. java string类型_java中String类型
7. 站在前人的肩膀上，新一代数学家正在崛起
8. 【JAVA 第三章 流程控制语句】课后习题 键入日期输入星期几
9. C#LeetCode刷题之#219-存在重复元素 II​​​​​​​（Contains Duplicate II）
10. Andrid Floating Action Button
11. 视图查询缓慢mysql_《高性能MySQL》读书笔记——第一章、MySQL架构与历史
12. Win_server_2012如何将“计算机”图标放在桌面
13. 《算法设计与分析》王红梅 第二版部分习题
14. Word宏的利用学习
15. 程序员10个必须有的Android应用程序
16. 51单片机系统板/开发板原理图以及烧写方法
17. 计算机主机结构图手画,流程图怎么画简单又漂亮
18. 84.常用的返回QuerySet对象的方法使用详解：select_related, prefetch_related
19. C语言编程＞第二十二周 ④ 从键盘输入一组小写字母，保存在字符数组str中，请补充fun函数，该函数的功能是：把字符数组str中字符下标为偶数的小写字母转换成对应的大写字母，结果仍保存在原数组
20. qq 表情gif免费下载

热门文章

1. 云课堂服务器技术支持,中学语音教室云课堂云服务器
2. 寻找漂流瓶上人快老板
3. 老少恋中的愉悦和不安
4. 论文分享 | 可控笔触的快速风格化迁移
5. OpenLayers 3 之 Overlay（覆盖物）详解
6. 为了探究妹纸对内衣的喜好，我爬了淘宝内衣店的数据！
7. CSS学习笔记——动画进阶(八音盒动画效果)
8. java 短信找回密码_Java --修改密码/找回密码 接口共用
9. 2019.07.01-2019.08.01 软件测试实习生月报
10. 卡尔曼滤波室内温度估计