QSS 样式表（一）

在开发应用程序时，往往对界面的美观有一定的要求。Qt 引入了 QSS 机制，使得界面的美化工作变的轻轻松松。嗯，QSS听着有点耳熟。是的，QSS的语法和CSS类似。在此做些总结。

先来看一个简单的例子。

 1 #include <QtGui/QPushButton>
 2 #include <QtGui/QWidget>
 3 #include <QTextCodec>
 4 #include <QtGui/QHBoxLayout>
 5 #include <QtGui/QApplication>
 6 
 7 int main(int argc, char *argv[])
 8 {
 9     QTextCodec::setCodecForTr(QTextCodec::codecForName(QTextCodec::codecForLocale()->name()));
10     QTextCodec::setCodecForLocale(QTextCodec::codecForName(QTextCodec::codecForLocale()->name()));
11     QTextCodec::setCodecForCStrings(QTextCodec::codecForName(QTextCodec::codecForLocale()->name()));
12 
13     QApplication app(argc, argv);
14 
15     QWidget *pWidget = new QWidget;
16     QPushButton *pBtn = new QPushButton;
17     pBtn->setText(QObject::tr("我是一个按钮"));
18     QHBoxLayout *pLayout = new QHBoxLayout;
19 
20     pLayout->addWidget(pBtn);
21     pWidget->setLayout(pLayout);
22     
23     pWidget->show();
24 
25     return app.exec();
26 }

运行结果：

不是很好看吧！让我们对以上代码稍做修改：

 1 #include <QtGui/QPushButton>
 2 #include <QtGui/QWidget>
 3 #include <QTextCodec>
 4 #include <QtGui/QHBoxLayout>
 5 #include <QtGui/QApplication>
 6 
 7 int main(int argc, char *argv[])
 8 {
 9     QTextCodec::setCodecForTr(QTextCodec::codecForName(QTextCodec::codecForLocale()->name()));
10     QTextCodec::setCodecForLocale(QTextCodec::codecForName(QTextCodec::codecForLocale()->name()));
11     QTextCodec::setCodecForCStrings(QTextCodec::codecForName(QTextCodec::codecForLocale()->name()));
12 
13     QApplication app(argc, argv);
14 
15     QWidget *pWidget = new QWidget;
16     QPushButton *pBtn = new QPushButton;
17     pBtn->setText(QObject::tr("我是一个按钮"));
18 
19     // 新添加的代码
20     // 用于 QPushButton 的外观美化
21     // 这句话就是QSS样式
22     // QPushButton{ background-color: rgb(120,120, 120); color: rgb(0, 230, 230); }
23     // 这个函数就是应用样式
24     // setStyleSheet
25     pBtn->setStyleSheet(QObject::tr("QPushButton{ background-color: rgb(120,120, 120); color: rgb(0, 230, 230); }"));
26 
27     QHBoxLayout *pLayout = new QHBoxLayout;
28 
29     pLayout->addWidget(pBtn);
30     pWidget->setLayout(pLayout);
31     
32     pWidget->show();
33 
34     return app.exec();
35 }

以上两段代码比较，第二段代码增加了25行这一行代码，运行效果：

可以看到按钮的外观发生了底色，按钮的文本颜色改变。这就是QSS的神奇之处。

总结：QSS其实就是一段文本，这段文本里指定了控件的外观属性（如背景色、边框、文本）应该使用哪些属性值做改变。QSS 样式文本要想应用在 Qt 程序里，可以使用 setStyleSheet 函数。象本文对QPushButton应用样式，可以调用QPushButton的成员函数setStyleSheet。

QSS 样式表 （一）

QSS 样式表（一）