[Interest] styling a checkable item in a QListWidget

[Hamish Moffatt]

Hoi,

I've got checkable items in a QListWidget and I'd like to use custom 
images for the disabled, checked and unchecked states. I'm using 4.8.x. 
What's the correct selector to use for these?

The documentation implies that QListView::item is used to refer to the 
sub-control, but I'm not having a lot of luck with that.

I've tried setting the image property for the following selectors; (ie 
selector { image: url(:/foo/bar.png}; }):

QListWidget::item:unchecked - normal checkbox is drawn, image is not 
shown at all
QListWidget::item:indicator:unchecked - normal check box is drawn, image 
is also shown centered in the item

QListWidget::indicator:unchecked - image is used as the checkbox, but 
it's the size of the original checkbox, not the size of the image.

(Same for :checked. :disabled seems to be impossible?)

The documentation says that setting the image property implicitly sets 
the width and height of the sub-control, but this doesn't seem to be 
true. Setting QListWidget::indicator's width and height helps, but then 
the text overlaps the image. Oddly enough I can fix that by setting 
padding on QListWidget::item.

So I ended up with the following

QListWidget::indicator { width: 80px; height: 80px; }
QListWidget::indicator:unchecked { image: url(:/foo/bar.png); }
QListWidget::indicator:checked { image: url(:/foo/baz.png); }
QListWidget::item { padding-left: 0px; }

But there must be a better way?


Hamish