Qt之QSS(Q_PROPERTY-自定义属性)


 

目录(?)[+]

 

简述

Qt之QSS(Q_PROPERTY-原始属性)一节我们分享了Q_PROPERTY-原始属性的用法,但通常情况下我们需要很多自定义样式,例如:动态获取QSS样式,这时自定义属性就能很好的发挥其用武之地了。

 

 

问题

在使用QAbstractItemModel、QAbstractItemDelegate更新表格样式的时候,比如:背景色、前景色等,我们通常的做法是定义一些颜色常量,然后根据不同的条件显示不同的颜色,要么就是通过QSS全局设置,让所有的背景色、前景色保持一致。

这有一个问题,局限性太强,无法动态获取颜色值,大大降低了程序的扩展性。

解决方案

QAbstractItemModel、QAbstractItemDelegate均继承自QObject,而QSS只能用于QWidget及其子孙类,那么,如何动态获取样式属性值呢?

三部曲:

  • 创建一个从QWidget继承的专用类StyledWidget。
  • 为StyledWidget添加自定义属性,并使用Q_PROPERTY声明
  • 自定义QSS,使用自定义属性,语法:qproperty-<property name>

其中,Q_PROPERTY声明有以下要求:

  • READ getFunction 
    用于读取属性,使用const限定,返回属性的类型或者类型的指针或引用。

  • WRITE setFunction 
    用于设置属性,参数是一个属性的类型,或者属性的const指针或引用,返回

实例

效果

这里写图片描述

源码

创建一个从QWidget继承的专用类StyledWidget,为其添加自定义属性,并使用Q_PROPERTY声明:

StyledWidget.h

#ifndef STYLED_WIDGET #define STYLED_WIDGET #include <QWidget> class StyledWidget : public QWidget { Q_OBJECT Q_PROPERTY(QColor normalColor READ normalColor WRITE setNormalColor DESIGNABLE true) ... public: explicit StyledWidget(QWidget *parent = 0); ~StyledWidget(); QColor normalColor() const; void setNormalColor(QColor color); ... private: QColor m_normalColor; ... }; #endif // STYLED_WIDGET
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24

StyledWidget.cpp

... QColor StyledWidget::normalColor() const { return m_normalColor; } void StyledWidget::setNormalColor(QColor color) { m_normalColor = color; } ...
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11

QSS

QSS中使用自定义的属性设置对应的样式:

StyledWidget { qproperty-normalColor: white; qproperty-disableColor: gray; qproperty-highlightColor: rgb(0, 160, 230); qproperty-errorColor: red; }
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

使用

在需要设置样式的类中声明StyledWidget:

class TableModel : public QAbstractTableModel
{
    Q_OBJECT

public:
    ... QVariant data(const QModelIndex &index, int role = Qt::DisplayRole) const; ... private: ... StyledWidget m_styledWidget; }; 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13

使用自定义属性设置样式:

QVariant TableModel::data(const QModelIndex &index, int role) const
{
    if (!index.isValid()) return QVariant(); switch (role) { case Qt::TextColorRole: { if (index.column() == FILE_NAME_COLUMN) return m_styledWidget.normalColor(); if (index.column() == SIZE_COLUMN) return m_styledWidget.highlightColor(); if (index.column() == STATUS_COLUMN) return m_styledWidget.errorColor(); } ... } return QVariant(); }


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM