Pull to refresh

Отлаживаем Qt Style Sheet

Reading time 3 min
Views 22K
Популярный фреймворк Qt имеет очень удобный механизм управления стилями UI — Qt Style Sheet. Благодаря которому стиль виджетов и окон можно задать в CSS-подобной форме. Стиль может храниться как в ресурсах приложения так и во внешенем файле.
В своей практике постоянно сталкивался с задачей отладить файл стиля в реальном проекте. Если для веб-приложений достаточно нажать F5 в браузере, то на десктопе придется перезапускать приложение, иногда авторизовываться, добираться до нужной формы. Это большая потеря времени. Попробуем сделать инструмент для удобной отладки стилей. Сформулирую пользовательский сценарий:

Хотим править файл стиля и сразу смотреть как это выглядит в любой форме приложения.


Приступая к реализации, будем считать, что пользователя устроит вариант — сохранить файл стиля — нажать кнопку обновления в приложении. Реализация будет опираться на механизм перехвата событий приложения (eventFilter). При старте приложения установим перехватчик событий, который будет перезагружать файл стиля при нажатии заданной клавиши.

Немного кода:
Описание класса
StyleLoader.h
#ifndef STYLELOADER_H
#define STYLELOADER_H

#include <QObject>
#include <QKeySequence>
class StyleLoader: public QObject
{
    Q_OBJECT
public:
    static void attach(const QString& filename = defaultStyleFile(),
                       QKeySequence key = QKeySequence("F5"));

    bool eventFilter(QObject *obj, QEvent *event);
private:
    StyleLoader(QObject * parent, const QString& filename, const QKeySequence& key);
    void setAppStyleSheet();
    static QString defaultStyleFile();
    QString m_filename;
    QKeySequence m_key;

};
#endif // STYLELOADER_H


и реализация:
#include "StyleLoader.h"
#include <QApplication>
#include <QFile>
#include <QKeyEvent>
#include <QDebug>

void StyleLoader::attach(const QString &filename, QKeySequence key)
{
    StyleLoader * loader = new StyleLoader(qApp, filename, key);
    qApp->installEventFilter(loader);
    loader->setAppStyleSheet();
}

bool StyleLoader::eventFilter(QObject *obj, QEvent *event)
{
    if (event->type() == QEvent::KeyPress)
    {
        QKeyEvent *keyEvent = static_cast<QKeyEvent *>(event);
        if(m_key == QKeySequence(keyEvent->key()))
            setAppStyleSheet();
        return true;
    }
    else
        return QObject::eventFilter(obj, event);
}

void StyleLoader::setAppStyleSheet()
{
    QFile file(m_filename);
    if(!file.open(QIODevice::ReadOnly))
    {
        qDebug() << "Cannot open stylesheet file " << m_filename;
        return;
    }
    QString stylesheet = QString::fromUtf8(file.readAll());
    qApp->setStyleSheet(stylesheet);
}

QString StyleLoader::defaultStyleFile()
{
    return QApplication::applicationDirPath() + "/style.qss";
}

StyleLoader::StyleLoader(QObject *parent, const QString& filename, const QKeySequence &key):
    QObject(parent),
    m_filename(filename),
    m_key(key)
{

}



Чтобы подключить инструмент к приложению, достаточно написать одну строчку где-нибудь в main():

StyleLoader::attach();

В таком варианте будут использоваться настройки по-умолчанию:
Файл стиля: Папка_с_исполняемым файлом/style.qss;
клавиша для обновления: F5.

Можно задать собственные значения:
StyleLoader::attach("c:/myStyle.qss", QKeySequence("F6"));


Теперь мы можем запустить наше приложение, в любой момент подправить файл стиля, нажать F5 и сразу же увидеть как это будет выглядеть.

PS: код компактный, поэтому рекомендую просто стащить себе в проект. Вскоре выложу на Github под свободной лицензией.
Tags:
Hubs:
+14
Comments 12
Comments Comments 12

Articles