View Full Version : Non-exclusive stack layout

Adam Badura
5th July 2013, 10:04
Qt offers QStackedLayout/QStackedWidget but they are exclusive: only a one page can be visible at a time. While I need one that has all pages visible at all the time. What are my options here?

My scenario started simpler. At first I had a combo box that selects a type and based on that QStackedWidget showed appropriate page. To make it work as I wished I located the QStackedWidget in a QVBoxLayout of the main widget. (That way the QStackedWidget resized properly with the main widget.) The combo box was a separate widget also located within the main widget but outside of QVBoxLayout. It is difficult to make it in the Designer (at least for me) but you can do that easly in UI file itself, then the Designer shows it properly. Since the combo box and QStackedWidget overlapped I set proper z-order. It seemed to work provided that I took care while designing widgets for the pages that there is free space where the combo box is located.

But then things got complicated. I needed to add another widget to the main widget in the similar way as the combo box, so that it will overlap with the QStackedWidget. The difficult part was that unlike the combo box which was located in left-top corner the new widget had to be located in top-right corner. And that requires care with resizing the main widget since that newly added widget would have to be relocated as well. I wanted to avoid doing that in code since it should be done by layouts. And so the journey starts!

(Now when I think about it I could have made it simpler if I would have used QStackedLayout instead of QStackedWidget within "artificial" QVBoxLayout. I didn't do that because Designer doesn't offer QStackedLayout in its tool box. Why? Also it wouldn't change anything relating the issue presented here.)

My first attempt was to have the combo box and newly added widget joined in a QHBoxLayout with spacer inside. That would be perfect. If not for widget limitation of having only a single layout and that was already allocated for QVBoxLayout storing QStackedWidget. Removing that QVBoxLayout wouldn't help because I would end with the very same problem only with QStackedWidget instead of the newly added widget (since QStackedWidget also needs to resize along the main widget).

Then I looked for a different layout but it seems no other layout does what I need.

So I considered writing my own layout. Especially that there is already an example of CardLayout (http://qt-project.org/doc/qt-5.0/qtwidgets/layout.html#how-to-write-a-custom-layout-manager) that does a similar thing. But here the question was how to add a custom layout to UI file and Designer? Before versions 5.0 it seems this wasn't supported (http://qt-project.org/forums/viewthread/6322). Is this supported now?

Are there any better solutions?

5th July 2013, 11:04
Could you post a mockup image describing what you want to do?

Adam Badura
5th July 2013, 11:40
Could you post a mockup image describing what you want to do?

Here you go:


Note that this screen from actual experimental code. Some things are not well yet (like the type combo box is not well aligned with other controls).

The type combo box (and now also the new widget) are supposed to stay there where they are. Also the new widget should be anchored to the right edge of the main widget. As I described I would like those two to behave as if they were in a single QHBoxLayout with a spacer in between.

While the remaining widgets are provided by some other widget placed as a page in QStackedWidget that is stretched on the main widget bellow (z-order) the combo box (and now also the new widget). There will be multiple pages in that QStackedWidget with various controls on each page lay out in various ways. Yet I expect most of them to place additional data on the line between type combo box and the new widget.

The new widget will be hide/show details. When hidden only the controls on the type combo box - the new widget will be shown.