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

в 12:21, , рубрики: qt, style sheet, stylesheets

Отлаживаем Qt Style SheetПопулярный фреймворк 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 под свободной лицензией.

Автор: ncix

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js