Qt客户端自定义外观（一）

Qt自定义外观主要有以下三种方法:

- 使用Qt样式表

- 子类化窗口部件并重写绘制和鼠标事件

- 子类化QStyle或者一个预定义的风格

本篇文章主要介绍第一种通过样式表定义外观的使用方法，鉴于编写CSS文件内容相关的文章已经有很多，这里就不赘述，本篇主要通过一个ResourceManager类的的设计来说明在客户端中如何通过样式表来自定义外观。

设计思路

ResourceManager的主要功能是通过CSS自定义外观，通过两个方式， 一是读取本地的CSS文件，通过类声明中的initialize方法实现，二是在代码中一些CSS语句来实现，通过yellowButtonStyle方法实现（鉴于篇幅，此处只举此一例）。第一种方法适用于特定的控件，需要根据控件名来具体描述，第二种适合于一些通用控件，对某一类控件进行统一描述。

因为一个客户端用于自定义外观的对象只需要有一个，所以将该类设计成单例。

ResourceManager类声明

#ifndef RESOURCEMANAGER_H
#define RESOURCEMANAGER_H
#include <QObject>
class QApplication;
class ResourceManager : public QObject
{
Q_OBJECT
public:
static ResourceManager &instance();
void initialize(QApplication &app);
QString yellowButtonStyle() const;
private:
ResourceManager(QObject *parent = 0);
~ResourceManager();
QString loadResourceFileAsString(const char *name);
static ResourceManager singleton;
};
#endif // RESOURCEMANAGER_H

ResourceManager的声明中initialize方法定义如下：

void ResourceManager::initialize(QApplication &app)
{
const QString &commonCss = this->loadResourceFileAsString(":/styles/common.css");
app.setStyleSheet(commonCss);
}

QString ResourceManager::loadResourceFileAsString(const char *name)
{
QFile file(name);
file.open(QFile::ReadOnly);
QTextStream filetext(&file);
QString text= filetext.readAll();
return text;
}

ResourceManager的声明中yellowButtonStyle方法定义如下：

QString ResourceManager::yellowButtonStyle() const
{
return "QPushButton { "
"background-color: #f5a22b;"
"border-radius: 4px;"
"color: white;"
"border: none;"
"}"
"QPushButton:pressed {"
"background-color: #e18700"
"}";
}

因为在主窗口打开的时候就需要加载资源，所以ResourceManager类就需要在主窗口对象创建之前被创建并且执行加载CSS文件的方法，所以需要子类化QApplication并在构造函数中调用ResourceManager类的initialize方法来加载资源，我们子类化QApplication函数并将新的类命名为SeetaoApplication。

SeetaoApplication类声明

#ifndef SEETAOAPPLICATION_H
#define SEETAOAPPLICATION_H
#include <QApplication>

class SeetaoApplication : public QApplication
{
Q_OBJECT
public:
SeetaoApplication(int argc, char *argv[]);
~SeetaoApplication();
static SeetaoApplication *instance();
};
#endif // SEETAOAPPLICATION_H

SeetaoApplication类的构造函数定义如下：

SeetaoApplication::SeetaoApplication(int argc, char *argv[]):
QApplication(argc, argv)
{
QCoreApplication::setOrganizationDomain(QLatin1String("*****.com"));
QCoreApplication::setOrganizationName("**科技");
QCoreApplication::setApplicationName(QLatin1String("***Editor"));
QCoreApplication::setApplicationVersion(QLatin1String("1.0"));
QApplication::setApplicationDisplayName("****系统");

setAttribute(Qt::AA_UseHighDpiPixmaps);

ResourceManager::instance().initialize(*this);
AccountManager::instance().restore();
}