0 前言

上一篇笔记对样式表进行了初步学习，QT学习_07_样式表的初步学习_江湖上都叫我秋博的博客-CSDN博客，在文末我们提到了“样式表肯定不能直接这么写在构造函数里面，那么多样式表看着心就堵，所以下一篇文章考虑如何把样式表用单独的文件，或多个不同的文件来写。”，时隔4个半月，特来还愿。一个好的Qt项目，样式表与逻辑肯定是分离的。在全网搜索了各种把样式表分离出来的办法， 用qss文件的办法是最常见的。 不过qss对局部生效这一点我还没搞清楚，或许它也没办法搞定局部生效的问题，所以本文讲的另一种办法。可以精准的设置每一个部件的样式。

1 正文

在文章QT学习_07_样式表的初步学习_江湖上都叫我秋博的博客-CSDN博客也提了，在构造函数中可以用以下语法来设置指定部件的样式表（局部生效）。

this->setStyleSheet(“样式表”); // 全局生效
ui->指定部件的objectName->setStyleSheet(“样式表”); // 局部生效

setStyleSheet函数的参数是一个QString字符串。这个QString字符串我可以用静态的全局变量的存储，我可以把这些静态全局变量的定义都放在同一个.h文件中，而不是用.qss文件中。

假设我的Qt项目，同时拥有主窗口和子窗口，而且主窗口和每个子窗口都是带 .cpp .h .ui文件的Qt设计师界面类，比如：Qt学习_11_构建内嵌子界面与独立子界面的框架_江湖上都叫我秋博的博客-CSDN博客这篇文章的例子项目。

那么我们可以给每一个Qt设计师界面类都添加一个样式表.h文件。

添加完之后的项目目录如下：

以download.h 和 download_qss.h为例， 我们需要在download.h里面包含download_qss.h。

#ifndef DOWNLOAD_H
#define DOWNLOAD_H#include 
#include  // 👈只看这里就好namespace Ui {
class Download;
}class Download : public QWidget
{Q_OBJECTpublic:explicit Download(QWidget *parent = nullptr);~Download();private:Ui::Download *ui;
};#endif // DOWNLOAD_H

 download_qss.h里，我们首先需要包含，然后就可以用静态全局变量来定义样式表了。

#ifndef DOWNLOAD_QSS_H
#define DOWNLOAD_QSS_H
#include // 全局生效样式表
// 命名规则:
// Download 本Qt设计师界面类的类名
// gqss g是global的缩写，【全局】的意思， qss就是Qt样式表的意思
// QLabel 表示本界面的所有QLabel的样式static QString Download_gqss_QLabel ="QLabel{""color:red;""}";// 局部生效样式表
// 命名规则:
// Download 本Qt设计师界面类的类名
// lqss l是local的缩写，【局部】的意思， qss就是Qt样式表的意思
// label1 只是类Download里面包含的某个QLabel部件类static QString Download_lqss_label1 ="QLabel{""color:green;""border-image:url(:/img/img_download)""}";#endif // DOWNLOAD_QSS_H

每一个静态的全局QString变量，它可以代表本主/子窗口类用于全局生效的样式表，也可以代表本窗口仅用于某个指定部件的样式表（一个样式表就可以根据不同伪状态设置不同的样式，因此就不用再细分了），所以在定义样式表的时候，我们用变量的名称（_gqss_全局样式/_lqss_局部样式）加以区分。

测试，先给Download子界面拉4个标签

 在download.cpp里面，分别全局加载和局部加载样式表。

#include "download.h"
#include "ui_download.h"Download::Download(QWidget *parent) :QWidget(parent),ui(new Ui::Download)
{ui->setupUi(this);this->setStyleSheet(Download_gqss_QLabel);          // 设置全局的QLabelui->label1->setStyleSheet(Download_lqss_label1);    // 仅设置label1
}Download::~Download()
{delete ui;
}

运行效果如下：

最后愿我们共同进步！ 感谢您的阅读，欢迎留言讨论、收藏、点赞、分享。