Photoshop designed element to Qt

[Nyte]

Hi all,

I've got a question concerning a design i made in photoshop and how I should best convert/implement it into Qt Creator.
First, the photoshop design:


(the icons are placeholders)

What you see is a little list box with save games ordered on date.
The dates (darkgrey boxes) are foldable with all it's contents below (light grey box).
The developer currently uses a treeview-element as a placeholder and works as intended. Only problem is that the Treeview doesn't look remotely similar.

We're now at the point that I should implement the design into Qt, but I don't really have an idea how to start with this list-box. Can I continue using the Treeview and style it till it looks the same? Or do i need other elements like a hierarchy of frames (which won't make the DEV team happy).

Any tips on how i could start?


TL;DR version ( i guess ):
The Level 1 Items (including branch) need a different styling then the Level 2 (sub)items (including branch). How

[wysota]

Can I continue using the Treeview and style it till it looks the same?

I don't think you can do that with just styling. But you can subclass QTreeView and provide your own painting and a custom delegate for items.

Or do i need other elements like a hierarchy of frames (which won't make the DEV team happy).

No, that's not a good idea.

An alternative is to use QtQuick where you can implement the whole tree in less than 5 minutes once you learn the technology.

[Nyte]

I don't think you can do that with just styling. But you can subclass QTreeView and provide your own painting and a custom delegate for items.

I'm not sure what the limitations are with styling a Treeview.
Basically, what i need to know is how (with a stylesheet, i'm not a dev) i can style the first item, and how i can style the subitems. If i know the selectors (something that in my experience with Qt so far is sometimes really hard to find out, even with the documents), I can experiment a bit.


-edit-

So far i know you have to use

QTreeWidget:item{ .. } to change the style of ALL the items in the Treeview, but the first level item and the 2nd level item needs to be different. Also, i need to draw the whole item, including the icon area....

[wysota]

I'm not sure what the limitations are with styling a Treeview.
Basically, what i need to know is how (with a stylesheet, i'm not a dev) i can style the first item, and how i can style the subitems. If i know the selectors (something that in my experience with Qt so far is sometimes really hard to find out, even with the documents), I can experiment a bit.


-edit-

So far i know you have to use

QTreeWidget:item{ .. } to change the style of ALL the items in the Treeview, but the first level item and the 2nd level item needs to be different. Also, i need to draw the whole item, including the icon area....

The whole stylesheet reference is here: Qt Style Sheets Reference. If something is not there then it won't work.

In general, as I said, what you want to do cannot be done without touching source code.