Styling Model/View items based on their ItemDataRole properties

[Adam Badura]

I have a QTreeView with items from my own model (QAbstractItemModel derived). Now I would like to style those items (with a stylesheet on the QTreeView) so that depending on various properties they would have various backgrounds.

Also it seems that this problem applies to any Model/View containers. Not just QTreeView.


For example doing alternate backgrounds is easy. alternatingRowColors on the QTreeView has to be true. Then in stylesheet you may use :alternate pseudo-selector to change properties for the alternate items so:

QTreeView::item {
  background: green;
}
 
QTreeView::item:alternate {
  background: blue;
}

QTreeView::item {
  background: green;
}

QTreeView::item:alternate {
  background: blue;
}

To copy to clipboard, switch view to plain text mode 

Doing selected items is similarly simple. In fact doing anything that is handled by Qt's pseudo-selectors is easy.

But what about properties that are not pseudo-selectors? In particular how to select style based on values associated with ItemDataRole (which seams to be the only reasonably generic method of storing data in models)?

Note that there is a trick. If for example you do not use checked state you might "reuse" that state to map to something of your own and then you have a pseudo-selector for it... But this is just a workaround and not even a general one.


With QTreeWidget it seems you can go by having a dedicated QWidget-derived class for the items where you would add Q_PROPERTY with whatever you want. Then you can access that property by name in the stylesheet.

See for example "Using custom Q_PROPERTY with Stylesheet" question here on Qt Centre and "Trigger an update for the widget while using dynamic properties." note at the end of Qt Style Sheets Examples.

But the *View classes do not have any QWidgets or even QObejcts for their items (or at least not public accessible ones).


There is also possibility to provide own QAbstractItemDelegate, possibly one derived from QStyledItemDelegate. But that makes stylesheet interaction a bit harder.

With simple staff like background-color property it seems doable. But how would you simulate border-image, padding and many other styles in complex sets?

Not to mention that once you write an item delegate the code is frozen. If Qt changes ways of rendering stylesheet (improves it somehow) you will not benefit from it... Also is makes logic/presentation separation a bit harder. Now you need a programmer to style those items, not just a CSS-enabled graphics-guy...


So is there any way to subclass in stylesheet based on model-provided properties/data?

(Originally I asked this question on Stack Overflow: http://stackoverflow.com/questions/1...ole-properties but due to lack of activity I decided to "reask" here.)

[wysota]

I have a QTreeView with items from my own model (QAbstractItemModel derived). Now I would like to style those items (with a stylesheet on the QTreeView) so that depending on various properties they would have various backgrounds.

I don't think this is possible. Such customizations should be done either by providing a custom delegate or by returning a different Qt::BackgroundRole value in the model (or both).

[Adam Badura]

I don't think this is possible. Such customizations should be done either by providing a custom delegate or by returning a different Qt::BackgroundRole value in the model (or both).

Well... The issue with those approaches is that they are difficult to integrate nicely with CSS styling especially with various styles (like border-image). Not to mention that it is MUCH more work. Oh well...

[wysota]

Well... The issue with those approaches is that they are difficult to integrate nicely with CSS styling especially with various styles (like border-image). Not to mention that it is MUCH more work. Oh well...

It's not that much more work. I don't know how complex your styling is but it shouldn't be that hard to either do the same in a delegate or integrate the two approaches. For example implementing border-image in C++ is up to 9 lines of code.

[Adam Badura]

It's not that much more work. I don't know how complex your styling is but it shouldn't be that hard to either do the same in a delegate or integrate the two approaches. For example implementing border-image in C++ is up to 9 lines of code.

So is there a way to access stylesheet data from within QStyledItemDelegate? The painting/measuring methods of QStyle do access it. But I didn't see any way to do it myself neither using QStyle nor QStyleOptionViewItem.

[wysota]

So is there a way to access stylesheet data from within QStyledItemDelegate?

No, what sense would it make? QStyledItemDelegate will respect your stylesheet by itself if you remember to call the base class implementation in your subclass.

[Adam Badura]

No, what sense would it make? QStyledItemDelegate will respect your stylesheet by itself if you remember to call the base class implementation in your subclass.

That way I could set up some styles which I would then query for myself (in item delegate) and use them in painting operation. Now I cannot (for model/view items) - or better to say I'm very limited in my options. If I would like to use border-image for fancier (stretched) background in normal, alternate and selected modes then its all fine. But if my items have another "mode" like for example "erroneous" with red background then how should I proceed? Since as for now I can see just one option: throw away the stylesheet and embed everything in item delegate.

Actually this is what I was advised to do by my co-workers. But I found it hard to believe that it cannot be done with stylesheets as main "style" source.

(The border-image example is not just a sample. QStyleOptionViewItem don't seem to provide means to set/overwrite border-image. It only allow to set background brush. Which will be then cheerfully overpainted with the border-image that comes from stylesheet...)

[wysota]

That way I could set up some styles which I would then query for myself (in item delegate) and use them in painting operation.

Well, you can query whatever you want. The stylesheet is available in the stylesheet property of the widget, its parent, etc. But there is no cascading and no parsing. You have to do everything manually. Of course you can store a stylesheet for each item separately in the model and then parse it and do whatever you want with it.

Now I cannot (for model/view items) - or better to say I'm very limited in my options. If I would like to use border-image for fancier (stretched) background in normal, alternate and selected modes then its all fine. But if my items have another "mode" like for example "erroneous" with red background then how should I proceed? Since as for now I can see just one option: throw away the stylesheet and embed everything in item delegate.

I already told you that implementing border-image in C++ is 9 lines of code (or less).

Actually this is what I was advised to do by my co-workers. But I found it hard to believe that it cannot be done with stylesheets as main "style" source.

If all you want from style sheets is image-border, then drop the stylesheet and paint the image in the delegate the way you want it.