girish
Qt
KDE
Itemviews
Styles
Posted by girish
 in Qt, KDE, Itemviews, Styles
 on Thursday, November 01, 2007 @ 11:27

It all started as a small feature request - Adding style sheet support for Item views. I quickly found out that our default delegate, QItemDelegate, doesn’t use QStyle the way it is supposed to. Jens had faced the same problem when trying to provide native look and feel for Vista and ended up writing his own delegate. This is quite a limitation because currently authors of custom QStyles can customize the look of everything in Qt except item views.

So was born QStyledItemDelegate - The default delegate for Item views starting 4.4. To let that sink in - all our views now delegate painting to QStyledItemDelegate instead of QItemDelegate. QStyledItemDelegate prompty plays its part by delegating everything to QStyle :-) The cool thing is that this delegate uses the QStyle to determine the sizeHint, the layout of the text, indicators and icon. And of course, it paints everything through QStyle. Complete control to QStyle.

Jens has already incorporated this new feature into QWindowsVistaStyle. So, by default, your views will look all fancy in 4.4 like below:

vistatree2.png

We are unsure about how selection in table view must be handled. We are open to suggestions:

Chart example in vista style

On other platforms, they should exactly like before. If you had written your own delegate using QItemDelegate, it is completely unaffected by this change. If having to write a custom QStyle or a custom delegate sounds daunting, just use style sheets. Try something like this,

QTreeView::item {
    border: 1px solid #d9d9d9;
    border-top-color: transparent;
    border-bottom-color: transparent;
}

QTreeView::item:hover {
    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #e7effd, stop: 1 #cbdaf1);
    border: 1px solid #bfcde4;
}

QTreeView::item:selected {
    border: 1px solid #567dbc;
}

QTreeView::item:selected:active{
    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #6ea1f1, stop: 1 #567dbc);
}

QTreeView::item:selected:!active {
    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #6b9be8, stop: 1 #577fbf);
}

Here’s how it looks:

stylesheet-treeview.png

See Customizing QTreeView, Customizing QListView for more information.

We merged the new delegate into our main branch last week, so if use the latest snapshots, you already have it. If you have any specific requirements to styling of tree widgets, list views and tables in mind and are wondering if it is possible now using the new delegate, please leave behind a note!

8 Responses to “QStyledItemDelegate - Styling Item views”

» Posted by NoobSaibot
 on Thursday, November 01, 2007 @ 12:39

Great news girish! Thanks a bunch :)

» Posted by David Johnson
 on Thursday, November 01, 2007 @ 18:00

Let me ask a clarifying question: Should we inherit from QStyledItemDelegate for our editing delegates, so that we get styled item views? Or is this unnecessary?

» Posted by Aidan
 on Thursday, November 01, 2007 @ 23:11

Awesome - I thought it was kind of funny the other day that I needed to sub-class QItemDelegate in order to set the row height (sizeHint).

Regarding QMacStyle and item views:

1. There’s still the restriction on styling that means that the header has a white margin and border around it - it’s looked out of place for years! The frame border should be the header border - which seems simple, until you remember that sorting by a column means that the border surrounding the header changes colour -> tree view outer border at header changes colour (the scrollbar shouldn’t go to the top either, but I can live with that…)

2. It would be nice if alternatingRowColors had the option to work either on item delegates (as it does now) or as a background brush for the entire view (Cocoa style).

3. (I know I should visit the task tracker, but…) alternatingRowColors ignores the Graphite colour setting - it’s always blue and white.

» Reply from girish
 on Friday, November 02, 2007 @ 11:50

David Johnson - Yes, you should inherit from QStyledItemDelegate in the future for your editing delegates. We will continue to make sure QItemDelegate works but it is not possible to assure platform look and feel with QItemDelegate.
Aidan - I am just heading over to the Mac team to get answers to your questions :-)

» Reply from girish
 on Friday, November 02, 2007 @ 12:36

Aidan - Thanks for the feedback!

1, 3 - Task 186052. Should be fixed for 4.4.
2 - Task 185994.

» Posted by Aidan
 on Sunday, November 04, 2007 @ 22:49

girish - Thank _you_.
Sorry for being lazy with the task tracker :-)
Keep up the good work!

» Posted by Marco
 on Monday, November 05, 2007 @ 16:17

Great news about another cool new feature in Qt 4.4!
Really, but I have to say that I’m using Qt4.3 for 2 weeks now, before we used only Qt3, and stumbled over 7 bugs including one crash only by using QTreeWidget.
The crash will be fixed in Qt4.3.3, 3 bugs are scheduled for Qt4.4 and 3 bugs are not scheduled or scheduled for 4.5!
Examples:
http://trolltech.com/developer/task-tracker/index_html?method=entry&id=183345
No reaction on a user click has no high priority even there is no work around?

http://trolltech.com/developer/task-tracker/index_html?method=entry&id=185734
Qt::ScrollBarAsNeeded not correctly working, get fixed in 4.5 not at least 4.4?!

http://trolltech.com/developer/task-tracker/index_html?method=entry&id=175237
QHeaderView::ResizeToContents not correctly working and get fixed “some future release”?

So as a corporate user I’m gutted and have to say: please no more features if there are so much bugs.

» Reply from girish
 on Wednesday, November 07, 2007 @ 14:31

Adian, 185994 is fixed in the snapshots :-)



© 2008 Nokia Corporation and/or its subsidiaries. Nokia, Qt and their respective logos are trademarks of Nokia Corporation in Finland and/or other countries worldwide.
All other trademarks are property of their respective owners.