How to manage QSplitter in Qt Designer

Question

When I press a button, I bring up a dialog where user select things and press 'Ok' at the end. I want a splitter in this dialog. Left pane will show tree and right will show something else. How do I do that right?

From Qt example itself:

 QSplitter *splitter = new QSplitter(parent);
 QListView *listview = new QListView;
 QTreeView *treeview = new QTreeView;
 QTextEdit *textedit = new QTextEdit;
 splitter->addWidget(listview);
 splitter->addWidget(treeview);
 splitter->addWidget(textedit);

So in this example, splitter is created without any dialog resource. If I have to create this way, that would mean I have to create all my controls in the code as well rather than Qt Creator.

What is the right way to do this when I need other controls on the screen?

score 117 · Accepted Answer · answered Feb 04 '15 at 04:24

117

You can simply create splitter containing items in Qt Designer :

First place your widgets on your dialog or widget in designer (They should not be in a layout)
Select the widgets that you want to be in a splitter (By holding CTL and clicking on them)
Right click on a selected widget and from Layout menu select Lay Out Horizontally in Splitter or Lay Out Vertically in Splitter.
Now apply a grid layout to the dialog and everything should be OK. You would see something like this in Object Inspector View :

enter image description here

answered Feb 04 '15 at 04:24

Nejat

31,784
12
106
138

1

Thanks this worked great but my splliter is between tree and widget. The tree takes almost 80% of the width. I don't see anything in treeview/widget properties that may cause this, any tips? I want the tree to take like 30% and 70% will go to widget. – zar Feb 04 '15 at 16:33
2

See this post : http://stackoverflow.com/questions/25063003/how-to-initialize-the-splitter-handle-position-in-qt/25063164#25063164 – Nejat Feb 04 '15 at 18:15
That would probably require setting the stretch factors – Ruud van Gaal Jan 19 '17 at 16:10
Notice that you can also set 2 layouts in a splitter with the same example (instead of 2 widgets). – Patapoom Jun 24 '19 at 08:16
2

I'm unable to get this to work, as "Lay Out Vertically In Splitter" is always dimmed. I have a window with a centralWidget that is set to lay out vertically. Under that I have two layouts; those are the two things that I want to be under a splitter. I suspect that your comment "They should not be in a layout" is relevant – the centralWidget's layoutness may be causing the menu item to be dimmed (?). But if so: how do I make the centralWidget forget that I told it to use a vertical layout? I can find no way to strip off that setting. I really don't want to remake the window from scratch! – bhaller Jul 12 '19 at 20:22
@bhaller I have the same problem, how did you fix it? – Troyseph Oct 17 '20 at 20:08
1

@Troyseph In my app I ended up creating the splitviews in code and inserting them into the widget hierarchy. You can see my code in https://github.com/MesserLab/SLiM. Works great. – bhaller Oct 18 '20 at 00:29
@bhaller I found that you couldn't do it directly in a `QMainWindow` and that when you right click, you have to make sure it is inside one of the selected widgets, otherwise you're trying to create the QSplitter layout in the wrong widget. – Troyseph Oct 18 '20 at 13:53
This worked for me, but with very strange behavior. I had to select a minimum of 3x items (outside of any layouts) before the "Layout * in Splitter" would appear. Sometimes the first item selected was not included in the splitter. – Mitch Sep 09 '22 at 00:01

score 10 · Answer 2 · answered Feb 20 '21 at 16:24

Okay, I know this is ancient, but here's the complete answer.

First, within some sort of widget container, plop your pieces in. For the window I just did, I have a Widget as my window. I put two widgets inside that labeled something like topContainer and bottomContainer. I then put all the widgets they each need into them, and gave them their own layouts.

Then do NOT select the main container. Select the two widgets you want to split. You're in effect putting a splitter on them, not on the main container. So I went to the widget list window and selected both together, then right-click for the dialog window, scroll down to the Layout option, and "Lay Out Vertically in a Splitter" is NOT greyed out. Select it.

You still need a layout on the main container. A splitter is not a layout. So at that point, I just put a vertical layout on the main container.

To repeat: you are NOT setting a layout on the container holding the pieces you're trying to split. You are selecting the two widgets to split and adding a QSplitter around them. That's the trick to get it to work.

score 2 · Answer 3 · answered Feb 03 '15 at 21:53

You can still create your controls in a .ui file using Qt Designer (integrated in Qt Creator). Within Qt Designer, add a QWidget object to your dialog. Then, from QDialog derived class you'll write, directly in your constructor, create your QSplitter using the QWidget object as a parent.

This way, you can create all but the splitter object from Qt Designer.

I think it's also possible to create the QSplitter (as you can create a QButton, QCheckBox...) item directly from Qt Designer.

How to manage QSplitter in Qt Designer

3 Answers3

Linked