本篇介绍什么是样式表，讨论如何使用Qt样式表Qss修改应用程序外观，并通过实例进行讲解。
了解HTML的同学都知道，一般在HTML中我们把样式表叫做CSS，在Qt中我们称之为QSS。QSS和CSS并不完全等同，语法完全类似，定义上存在一些差别。
QSS是Qt程序界面中用来设置控件的背景图片、大小、字体颜色、字体类型、按钮状态变化等属性，用于美化UI界面。实现界面和程序的分离，快速切换皮肤。
QSS最大的优点就是简单便捷，我们可以通过它快速实现应用程序的外观界面。
QPushButton {color: red} //代表QPushButton 颜色为红色
2）几个选择器可以指定相同的声明，使用逗号“，”来分隔选择器
//代表QPushButton ，QLineEdit，QComboBox 颜色为红色
QPushButton，QLineEdit，QComboBox {color: red}
3）声明部分的规则有多个属性值时包含在花括号{}中，以分号;分隔，属性之间在QSS之间是不区分大小写的
QPushButton {color: red;background-color:white;}
Qt中设置样式表最主要的函数为setStyleSheet
通过实例来介绍如何去设置Qt的样式表，
1）新建工程
2）拉入一个按钮，此时编译运行之后，按下按钮其字体和颜色都是没有发生变化的。
3）通过样式表使得按下按钮后其字体和颜色发生变化。
（1）修改按钮中字体颜色ui->pushButton->setStyleSheet(QString("QPushButton{color:rgb(255,0,0)}"));实现按钮中的字体显示为红色
Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this);
ui->pushButton->setStyleSheet(QString("QPushButton{color:rgb(255,0,0)}"));
}
运行结果：
（2）设置按钮按下后的颜色变化
以下代码中：QPushButton:pressed表示按钮按下后，颜色为background-color:rgb(200,200,200);，border-style:inset;表示内边框；color:rgb(0,255,0);字体颜色为color:rgb(0,255,0);，其中“\”代表本行写不下，下行仍为同一行。
Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this);
ui->pushButton->setStyleSheet(QString("QPushButton:pressed{ \
background-color:rgb(200,200,200);\
border-style:inset;\
color:rgb(0,255,0);\
}\
QPushButton{color:rgb(255,0,0)}"));
}
运行结果：未按下按钮结果与上步一致，按下后字体颜色为绿色
上述的方法是使用setStyleSheet 函数实现QSS的方法，下来将会先介绍样式表的属性指向，然后利用QtCreate实现上述内容，最终探讨两种实现方法的区别。
以下属性值熟悉有什么内容即可，在使用时再去具体查询使用
1）QSS文本属性
2）QSS背景属性
3）QSS边框属性
4）QSS Box属性
我们将控件的一个区域称为Box，这个Box的内容如果溢出了如何处理，均使用Box属性进行设置
5）QSS 字体属性
6）QSS 外边框属性
控件之间的间距可以使用外边框属性设置
7）QSS 内边框属性
8）QSS 位置属性
#if 0
ui->pushButton->setStyleSheet(QString("QPushButton:pressed{ \
background-color:rgb(200,200,200);\
border-style:inset;\
color:rgb(0,255,0);\
}\
QPushButton{color:rgb(255,0,0)}"));
#endif
2）在UI中选择按钮，右键选择“改变样式表”，将样式表中设置的内容粘贴至“编辑样式表”中
运行之后得到的效果与使用setStyleSheet函数设置样式表一样
在“编译输出”位置查看
UI文件可以通过uic.exe来生成ui_widget.h，通过以下的构造函数中的ui->setupUi(this);加载界面
Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this);
}
ui->setupUi(this);其实就是在ui_widget.h中，代开ui_widget.h进行查看
对应内容如下：
#include <QtWidgets/QWidget>
QT_BEGIN_NAMESPACE
class Ui_Widget
{
public:
QPushButton *pushButton;
void setupUi(QWidget *Widget)
{
if (Widget->objectName().isEmpty())
Widget->setObjectName(QStringLiteral("Widget"));
Widget->resize(475, 384);
pushButton = new QPushButton(Widget);
pushButton->setObjectName(QStringLiteral("pushButton"));
pushButton->setGeometry(QRect(150, 160, 112, 34));
pushButton->setStyleSheet(QLatin1String("QPushButton:pressed{ background-color:rgb(200,200,200);\n"
" border-style:inset;\n"
" color:rgb(0,255,0);\n"
"}\n"
"QPushButton{color:rgb(255,0,0)}"));
retranslateUi(Widget);
QMetaObject::connectSlotsByName(Widget);
} // setupUi
void retranslateUi(QWidget *Widget)
{
Widget->setWindowTitle(QApplication::translate("Widget", "Widget", Q_NULLPTR));
pushButton->setText(QApplication::translate("Widget", "PushButton", Q_NULLPTR));
} // retranslateUi
};
namespace Ui {
class Widget: public Ui_Widget {};
} // namespace Ui
QT_END_NAMESPACE
#endif // UI_WIDGET_H
可以看到工具自动生成代码如下，是与我们自己写的代码实际上是一样的。
pushButton->setStyleSheet(QLatin1String("QPushButton:pressed{ background-color:rgb(200,200,200);\n"
" border-style:inset;\n"
" color:rgb(0,255,0);\n"
"}\n"
"QPushButton{color:rgb(255,0,0)}"));
可以看出两种方法都是使用setStyleSheet实现的，原理上是一样的。
样式表除了上述作用，最大的作用是改变应用的皮肤
1）起始页面的qss文件的加载
文章来源：https://www.toymoban.com/news/detail-594734.html
2）通过按钮实现不同样式的切换
实现方法，通过按钮实现不同样式表的加载
9.学习视频地址：
【Qt学习系列】11.Qt样式表Qss
【Qt学习系列】11.Qt样式表Qss（2）文章来源地址https://www.toymoban.com/news/detail-594734.html
到了这里，关于01_1_Qt工程实践_Qt样式表Qss（什么是QSS；基本语法；setStyleSheet函数；样式表的属性值；利用QtCreate实现样式切换；样式表实现皮肤改变实例）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
