QSS使用心得

原创 已于 2022-02-08 16:24:25 修改 · 329 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#qt #开发语言

于 2022-02-08 14:21:52 首次发布

在使用QT进行界面开发时我们经常会借助QSS来进行图形的中控件的样式控制。本文记录个人在使用QSS中的一些使用心得和参考文献。

参考文章：

官方文档：

连接：

本人认为不错的博客
https://www.cnblogs.com/that-boy-done/p/11458130.html
https://blog.youkuaiyun.com/luyaozhima/article/details/106915479
https://blog.youkuaiyun.com/chenyijun/article/details/79766029

QT creator官方：

【Help】->【Search】:Qt Style Sheets Reference

可以查看QT的qss相关属性和理论基础

心得体会

1. QSS中使用ID选择器时，适用于下列情况：

  1. 通常的通过QT UI designer添加的控件ID
  2. 适用指针动态生成的，需要通过setObjectName指定ID，方可生效
jichenchen1990
关注
QSS配置与Kali Linux破解QSS PIN码
煮酒闲谈
05-18 4161
QSS配置与Kali Linux破解QSS PIN码工具kali Linux TP-Link安装驱动及TP-Link客户端程序选择网卡采用QQS1种连方式QQS第2种连接方式(输入PIN码进行连接)QQS第3种方式（输入设备的PIN码进行连接）（1）添加新的设备（2）添加成功使用KALI LINUX Reaver破解PIN码1）查看可用的无线网卡 iwconfig iwconfig 2) 启动
Qt中使用QSS设计风格
learning_notes
05-10 1881
Qt在界面设计过程中，每个按钮有时候会有很多显示状态，在进行setStyleSheet设计的时候为了代码的简洁化与程序的易读易改性，通常引入“QSS文件”来设计： 特别注意： （1）类型选择器(如本文的QPushButton)和“#”之间最好不要有空格； （2）“#”后面跟随的不是变量名，而是ObjectName，一般set与变量名相同的ObjectName。
利用QSS和CDLinux破解路由密码
申杰的博客
07-14 1399
鄰居把路由器密碼改了，不過又被我輕鬆破解了。用QSS和PIN碼成功連接。這次還進入了他的路由器看了看。
QT智能家居界面qss渲染
热门推荐
暖暖_的_纠结的博客
08-30 1万+
新手，刚开始入门QT，想着用QT做上位机，做界面是如何实现的，于是在一片博客中看到这个智能家居的界面，于是仿照这个博客编写了这和界面，这个界面原创是“流浪的鹅卵石”。在这里感谢“流浪的鹅卵石”， http://blog.youkuaiyun.com/u013704336/article/details/51072709 本人只是仿照。写本博客只是想记入学习过程中的一些心得和笔记： 下面上截图：
QT-按钮风格实时渲染+QSS实时显示+QPushButton样式
07-21
通过选择不同参数，实时渲染按钮的样式，并且实时生成QSS代码，直接使用即可达到想要的效果，很方便。
Rizek Qss Editor 1.13：Qt5编译打包的编辑器使用心得
标签“Rizek Qss Editor Qt5”是对标题的重申，并且为该软件提供了一个标识，便于在搜索和分类时使用。标签中的Qt5再次强调了软件开发的环境或使用的技术。 至于压缩包子文件的文件名称列表中仅列出了“Rizek Qss ...
QT布局以及使用QSS
ucasliyang的博客
11-23 4402
最近花了一周的时间学习了QT，学习的结果是能够使用它进行一些简单的界面开发，其实在学习的过程中发现QT的功能还是挺强大的，但因为学习的时间太短，可能它的精髓还没有能够体会到，现在想要把这段时间学习的心得体会记录一下，以便将来使用时可能会用到。 做了一个简单的界面，界面的大致情况如下图所示：            界面配色有点丑，整个界面我是使用QSplitter进行分隔的，分成了四个板块，分
高仿PS黑色风格QSS样式表开源代码
05-16
QSS允许开发者使用类似CSS的语法来定义Qt控件的外观。这包括颜色、字体、边框、背景、阴影等各个视觉元素。通过QSS，开发者可以轻松实现界面的个性化和统一化，极大地提高了UI设计的灵活性和效率。 在"高仿PS黑色...
QSS 高级
最新发布
10-01
QSS高级使用技巧和案例涉及到高级主题定制、复杂选择器运用、层叠和继承机制的深入理解等方面。 ### 高级主题定制 可以进行创建自定义模板和插件。通过这种方式，可以根据特定需求定制独特的主题样式。比如在一个...
Qt（一）--- QSS的语法
我只是一个单纯的2的博客
04-23 9134
Qt中的除了进来比较流行的使用qml进行界面的美化外，在早期，也就是4.x版本中，使用得比较多的的就是qss，就如qml是javascipt的变形体一样，qss是css的变形体，当然语法是和css基本一致，然后阅读了Qt的Assitant的帮助文档后，花了两天时间，大致了解了qss的语法，然后尝试用这个尝试着做了一下qq的登录界面，实现了大致的样子，大神们勿喷。（PS:这是初期的样子，先看看效果，
QT 7种QSS效果
05-22
QT，有关QSS 的7种效果 有助于对QSS的学习和ui设计使用。
史上最强QT自定义界面纯QSS
01-07
找遍百度谷歌,潜心钻研官方QSS应用示例http://qt-project.org/doc/qt-4.8/stylesheet-examples.html,陆续完善三个月,终于得出一套自定义UI的QSS方案,只需要查找替换对应七个颜色值,就可制作出一套精美皮肤!
QSS使用总结
奋斗Andy的博客
12-26 4294
QSS使用总结： 1. 什么是QSS QSS:全称Qt Style sheet即Qt样式表，他是Qt提供的一种用来自定义控件外观的机制。 QSS大量参考了CSS的内容，只不过QSS的功能比CSS要弱很多，体现在选择器更少，可以使用的属性也更少， 并且并不是所有的属性都可以在Qt的所有控件上。 2. QSS的使用 1 全局QSS文件方式 一般将项目中所有控件的样式写入一个文件中，然后在程序启动后加载文件然后设置全局的样式 int main(int argc, char* argv[]) { ...
Qt扫盲-QSS定制Qt Widget控件
洪源兄
01-03 1397
在使用样式表时，每个部件都被视为具有四个同心矩形的盒子:外边距矩形、边界矩形、内边距矩形和内容矩形。其实即是每一个继承至 QWidget 都支持的，这个和 前端的 CSS 里面的 盒子模型有些区别但是不大。
学习QT之QSS的使用
m0_73443478的博客
02-18 2966
学习QT之QSS的使用
QSS使用及常用控件的样式设置
shetougong的博客
03-14 4029
什么是QSS Qt Style Sheet简称QSS，Qt的样式表，模仿CSS，为Qt界面设置炫酷的展示效果。 如何使用QSS 推荐使用第二种方式 方式一：在界面中设置 不推荐使用 在编辑器中找到要设置样式的.ui文件，双击该文件，在界面编辑器中显示该文件 在界面编辑器的右侧，右键单击，在弹出的右键菜单中选择“改变样式表”字样 在弹出的“编辑样式表”框中输入正确的样式表代码 点击“应用”（或“use”）按钮，可以直接在编辑器界面中看到样式表对作用控件的样式改变 点击“确定”（或“Ok”）按钮，样式表设
QSS的使用
pzs0221的专栏
09-10 6746
一、程序应用qss文件 QString qssPath = QString("%1/stylesheet/style.qss").arg(a.applicationDirPath()); QFile file(qssPath); if(file.open(QFile::ReadOnly)) { a.setStyleSheet(file.readAll()); } file.close(); 二、单个应用qss
QSS 使用变量
04-13
<think>好的，用户问的是如何在QSS中使用变量或者替代方案。我之前记得QSS本身不支持变量，但可能需要用其他方法来实现类似的效果。首先，我需要回忆一下Qt的样式表机制。QSS类似于CSS，但功能有限，比如确实没有变量支持。那用户可能需要动态设置样式或者通过其他途径复用样式值。 接下来，考虑替代方案。比如，用户可能想统一管理颜色、字体等样式属性。一个办法是使用Qt的资源文件（qrc）来定义颜色常量，但资源文件主要是管理文件路径，可能不适用。或者，可以在代码中定义颜色变量，然后在设置样式时拼接字符串。例如，定义一个全局的颜色字符串，然后在需要的地方引用它。 另外，QtConcurrent模块的引用中提到需要在.pro文件中添加QT += concurrent，这可能和QSS无关，但用户提供的引用中有内存管理和配置的内容，可能需要考虑资源的使用效率。例如，使用宏定义或者单例类来保存样式相关的变量，避免重复代码。 还有一种方法是使用Qt的属性系统。可以为QWidget设置动态属性，然后在QSS中根据属性值来应用样式。例如，设置一个自定义属性“mainColor”，然后在QSS中使用attr(mainColor)来引用。不过，我需要验证这种方法是否可行，可能QSS不支持直接读取属性作为变量。 另外，用户提到的归一化公式可能和样式无关，但或许用户有动态计算样式的需求，比如根据数据调整颜色深浅。这时候可能需要结合C++代码生成QSS字符串，动态替换变量部分。 然后想到，可以使用QObject的属性或者动态属性。比如，在代码中设置某个对象的属性，然后在QSS中引用该属性。不过QSS是否支持这种动态属性呢？查文档的话，QSS支持根据对象属性选择样式，但不一定支持直接取值作为变量。 或者，使用预处理器。在编译前，用脚本处理QSS文件，替换其中的变量。这种方法需要构建系统的支持，比如在.pro文件中添加自定义步骤，用sed或其他工具替换变量。但这样会增加项目的复杂性，可能不是最佳方案。 还有一种可能是通过继承QProxyStyle来自定义样式，在代码中集中管理样式属性。这样可以在运行时动态调整样式，但需要更多的代码量。 另外，用户提供的引用[2]中提到了环境变量的配置，比如设置QT_MM_POOL_SIZE，这可能和内存管理有关，但或许可以启发使用环境变量来存储样式值？不过QSS是否支持读取环境变量呢？不确定，需要查证。通常QSS不支持环境变量，但可以通过在程序中读取环境变量，然后生成QSS字符串。 综合来看，最直接的替代方案可能是在代码中定义变量，构建QSS字符串时插入这些变量值。例如： ```cpp QString mainColor = "#FF0000"; QString style = QString("QWidget { color: %1; }").arg(mainColor); app.setStyleSheet(style); ``` 这样，通过C++变量来管理样式值，达到类似使用变量的效果。如果有多个变量，可以统一管理这些字符串，方便修改和维护。 另外，如果使用多个相似的样式，可以考虑使用函数或宏来生成样式字符串，减少重复代码。例如，定义一个函数返回带有特定颜色的样式字符串，然后在需要的地方调用该函数。 对于更复杂的动态需求，可能需要结合Qt的信号槽机制，在属性变化时重新应用样式。例如，当主题颜色改变时，重新生成并设置整个应用程序的样式表。 总结可能的解决方案： 1. 使用C++字符串变量拼接样式表。 2. 利用Qt的动态属性，根据属性选择不同的样式规则。 3. 使用预处理器在构建时替换QSS中的变量。 4. 集中管理样式字符串，通过函数生成样式表。 5. 结合Qt样式类（QProxyStyle）自定义绘制逻辑。 需要进一步验证这些方法的可行性，特别是动态属性和样式生成的部分。同时，用户可能希望尽量减少代码改动，所以推荐使用第一种方法，即在代码中用变量生成样式表，这样简单直接。</think>在QSS中实现变量功能可通过以下方法实现： ### 一、QSS变量替代方案 1. **字符串模板方法**（推荐方案） ```cpp // 定义颜色变量 const QString PRIMARY_COLOR = "#2CA7F8"; const QString FONT_FAMILY = "Microsoft YaHei"; // 构建样式表 QString styleSheet = QString(R"( QPushButton { background: %1; font-family: %2; } QLabel#title { color: %1; } )").arg(PRIMARY_COLOR, FONT_FAMILY); qApp->setStyleSheet(styleSheet); ``` *优势*：编译时类型检查，IDE支持自动补全，方便重构[^2] 2. **JSON配置法** ```json // style_config.json { "@primary_color": "#2CA7F8", "@font_size": "14px" } ``` ```cpp // 加载配置 QFile configFile(":/style_config.json"); configFile.open(QIODevice::ReadOnly); QJsonDocument config = QJsonDocument::fromJson(configFile.readAll()); // 动态替换 QString style = loadStyleSheet().replace("@primary_color", config["primary_color"].toString()); ``` ### 二、动态属性方案 ```cpp // 设置控件属性 widget->setProperty("customColor", QColor(44, 167, 248)); // QSS中使用 QPushButton { color: attr(customColor); } ``` *注意*：需要继承QStyle并重载drawControl()实现属性解析[^1] ### 三、预处理器方案 1. 安装Sass预处理工具 2. 创建qss变量文件： ```scss $primary: #2CA7F8; $padding: 8px; QPushButton { padding: $padding; border: 1px solid darken($primary, 10%); } ``` 3. 编译命令： ```bash sass --watch style.scss:style.qss ``` ### 四、Qt元对象系统方案 ```cpp class StyleManager : public QObject { Q_OBJECT Q_PROPERTY(QString primaryColor READ primaryColor NOTIFY themeChanged) public: static StyleManager* instance() { static StyleManager _instance; return &_instance; } // ... 属性访问方法 }; // QSS中使用 QPushButton { color: qproperty-primaryColor; } ``` **性能优化建议**： 1. 使用`QStyle::polish()`代替频繁设置样式表 2. 对全局样式启用`Qt::AA_UseStyleSheetPropagationInWidgetStyles`属性 3. 遵循内存管理优化配置[^2]： ```cpp qputenv("QT_NO_FT_CACHE", "1"); qputenv("QT_MM_POOL_SIZE", "2097152"); ```
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值