CQGUI框架之樣式管理

你們好,我是IT文藝男,來自一線大廠的一線程序員程序員

今天給你們講解基於C++/Qt的CQGUI框架的樣式管理實現。微信

在Qt平臺,實現窗口/控件美化或者自定義效果,有以下兩種方式app

  • 重繪
  • 樣式

對於重繪,我以前實現的一個效果以下圖所示::
框架

對於樣式,我以前實現的一個效果以下圖所示::
函數

所以,有了重繪以及樣式,就能實現高級、複雜的、優雅的UI效果;設計部有什麼好的UI效果圖,程序員就能把它實現。ui

Qt樣式(Qt StyleSheet,QSS)

QSS的主要功能是使界面的表現與界面的元素分離,使得設計成皮膚與界面控件分離的軟件成爲可能。QSS的概念、術語、語法很大程度上受到了CSS層疊樣式表的影響;因爲是所見即所得方式,QSS使用很方便插件

樣式加載方式

  • 在代碼中直接嵌入
  • 經過文件加載

優先推薦使用文件加載方式,與代碼脫離線程

CQGUI框架樣式

  • 公共樣式
  • 插件樣式

1、類職責

class StyleSheetManager : public QObject

2、類方法

class StyleSheetManager : public QObject
{
    Q_OBJECT
public:
    explicit StyleSheetManager(QObject *parent = NULL);
    void setStyleSheets(int theme, const std::string& font);
    void setStylesForApp(int theme, const std::string& font);
    void setStyleSheetForPlugin(const QString& plgName, int theme);
};

主要提供設置公共樣式、插件樣式的函數接口;與CQGUI框架的樣式邏輯保持一致設計

3、樣式文件集合

CQGUI框架的樣式文件集合以下圖所示::
code

4、加載公共樣式

QString apppath = QString(":/style/style%1/app.qss").arg(theme);
if (QFile::exists(apppath))
{
    QFile fileapp(apppath);
    if (fileapp.open(QFile::ReadOnly))
    {
        qss.append(fileapp.readAll().data());
        qApp->setStyleSheet(qss.toUtf8());
    }
}

5、加載插件樣式

QString styleSheetPath = QString(":/style/style%1/%2.qss").arg(theme).arg(plgName);
if (QFile::exists(styleSheetPath))
{
    QFile file(styleSheetPath);
    //獲取插件
    QObject* plugin = UIGolbalManager::GetUIGolbalManager()->GetPluginInstanceQt(plgName);
    if (plugin)
    {
        auto *plug = dynamic_cast<UIPluginInterface *>(plugin);
        if (plug)
        {
            if (file.open(QFile::ReadOnly))
            {
                QString qss = QString::fromUtf8(file.readAll());
                plug->setStyleSheet(qss.toUtf8());
            }
        }
    }
}

今天就講解到這裏,更詳細的代碼分析與講解,請關注微信公衆號(itwenyinan),觀看對應的的視頻版講解;謝謝

相關文章
相關標籤/搜索