如何在自定义小部件插件上使用qss

Qt StyleSheet专用于绘制预定义的小部件，因为其实现是Qt专用API的QStyle，因此无法预定义新属性。但是在Qt StyleSheet属性中，在这种情况下可以使用qproperty-foo，例如，设置时针的颜色，为此，您必须创建QProperty：

模拟时钟

#ifndef ANALOGCLOCK_H
#define ANALOGCLOCK_H

#include <QWidget>
#include <QtUiPlugin/QDesignerExportWidget>

class QDESIGNER_WIDGET_EXPORT AnalogClock : public QWidget
{
    Q_OBJECT
    Q_PROPERTY(QColor hourColor READ hourColor WRITE setHourColor)
public:
    explicit AnalogClock(QWidget *parent = nullptr);
    QColor hourColor() const;
    void setHourColor(QColor hourColor);
protected:
    void paintEvent(QPaintEvent *event) override;
private:
    QColor m_hourColor;
};

#endif

模拟时钟

#include "analogclock.h"

#include <QMouseEvent>
#include <QPainter>
#include <QTime>
#include <QTimer>

AnalogClock::AnalogClock(QWidget *parent)
    : QWidget(parent), m_hourColor(QColor(127, 0, 127))
{
    QTimer *timer = new QTimer(this);
    connect(timer, &QTimer::timeout, this, QOverload::of(&QWidget::update));
    timer->start(1000);

    setWindowTitle(tr("Analog Clock"));
    resize(200, 200);
}

QColor AnalogClock::hourColor() const
{
    return m_hourColor;
}

void AnalogClock::setHourColor(QColor hourColor)
{
    if (m_hourColor == hourColor)
        return;
    m_hourColor = hourColor;
    update();
}

void AnalogClock::paintEvent(QPaintEvent *)
{
    static const QPoint hourHand[3] = {
        QPoint(7, 8),
        QPoint(-7, 8),
        QPoint(0, -40)
    };
    static const QPoint minuteHand[3] = {
        QPoint(7, 8),
        QPoint(-7, 8),
        QPoint(0, -70)
    };

    QColor minuteColor(0, 127, 127, 191);

    int side = qMin(width(), height());
    QTime time = QTime::currentTime();

    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing);
    painter.translate(width() / 2, height() / 2);
    painter.scale(side / 200.0, side / 200.0);

    painter.setPen(Qt::NoPen);
    painter.setBrush(m_hourColor);

    painter.save();
    painter.rotate(30.0 * ((time.hour() + time.minute() / 60.0)));
    painter.drawConvexPolygon(hourHand, 3);
    painter.restore();

    painter.setPen(m_hourColor);

    for (int i = 0; i < 12; ++i) {
        painter.drawLine(88, 0, 96, 0);
        painter.rotate(30.0);
    }

    painter.setPen(Qt::NoPen);
    painter.setBrush(minuteColor);

    painter.save();
    painter.rotate(6.0 * (time.minute() + time.second() / 60.0));
    painter.drawConvexPolygon(minuteHand, 3);
    painter.restore();

    painter.setPen(minuteColor);

    for (int j = 0; j < 60; ++j) {
        if ((j % 5) != 0)
            painter.drawLine(92, 0, 96, 0);
        painter.rotate(6.0);
    }
}

然后您可以使用：

AnalogClock {
  qproperty-hourColor: #333333;
}

注意：默认情况下，QProperty的DESIGNABLE为true，因此您还可以从属性编辑器修改hourColor属性：