QT resizing layout with QT Designer? - c++

I'm quite new to QT and i want a layout to be resized as the window is resized, resizing it's parents elements.
Can I do it only using QT Designer? If not, how can I do it?
I currently have a WebView inside of a GridLayout inside of a Widget.
I already tried to mess with elements properties, but can't find a reference on it.
EDIT: The Grid Layout object isn't shown on the UI object, but everything else does, it also has a red background on QT Design, while everything else is green.
EDIT²: I've reseted the ui file, and added some more elements, the elements aren't being show on the app after being compiled, but they appear at ui preview, and resizing works there.
.ui file source code: http://pastebin.com/r3KYvvwj
OBS: the UI file generation seems messy, some elements aren't shown at QT Design(gridLayout_2).
Thanks in advance.

You need to specify a layout to the window. You can specify a suitable layout to the window by relevant toolbar icons in the Qt Creator. First select the window and then click on a suitable layout toolbar button to specify a layout to the window.

Related

QT layout output with 4K display

I have always worked with QT in c++ to create UI with a standard monitor resolution of 1920×1440 pixels.
Now I have changed to a new PC UHD 4K and I am experiencing some troubles with the result.
Here an example: I create with Qt a simple UI:
Then if I create the Preview from QT Creator/Designer, I get exactly the result I want:
Instead when I compile and execute the program, the result of the UI is much different:
Do you know how I can solve this issue?
From the Qt Designer screenshot it looks like your toplevel widget in that dialog does not have a layout.
To add a layout to the toplevel widget, select it in the widget tree on the right side and then click on one of the layouts, e.g. a QVBoxLayout.
What happened here was that the initial widget sizes were correct for the current resolution, but resize events never got promoted from the dialog class to the next widget level. This has nothing to do with high DPIs; it's plain old layout management. You were just lucky that the sizes were okay'ish initially.
Please notice that you might also add some margins to the outermost layout because it will shrink-wrap the contents tightly, so the dialog will look very odd at first. Open the dialog layout's properties to see the margins and play with them.
You can set the font size in your push button to look like this:
"QPushButton{"
"padding: 4px;"
"color: #000000;"
"background-color: red;"
"border: 2px;"
**"font-size:12px;"**
"}";

Allow user to resize widgets at runtime in QT5

I have an application written in C++/QT5 with a QListView widget within a QHBoxLayout within a QGroupBox. There is also a QTabWidget in the main window. I would like the user to be able to resize the QListView widget by clicking and dragging and for the other items to automatically resize themselves accordingly.
I feel like this should be something that is easily done within the framework of QT5, but I can't for the life of me find a way. Even having a border on the list view that I can resize within the code of my application would be a start.
Thanks to jhnnslschnr I was able to solve this via the QSplitter widget. If you're using QtCreator as I was, you can use QSplitter simply by Ctrl-clicking the widgets you want in the splitter and then selecting "Lay out horizontally (vertically) in splitter". The user can now select the partitioning at run-time.

How to manage QSplitter in Qt Designer

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?
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 :
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.
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.

QT window within window?

I'm setting up a small code editor using QT and following this example. However, i'm curious on how to create windows within windows or widgets within widgets. I'm trying to achieve something similar to these:
http://i.stack.imgur.com/Vn8Ut.png
http://www.hanselman.com/blog/content/binary/Windows-Live-Writer/Download-Visual-Studio-2013-while-your-f_1431E/image_4eb5427c-1ae7-4464-9c26-2282fe8d06c3.png
Is there an example of overlaying widgets like this?
Any alternative soloution for QMessagebox for IOS development (QWidget application only)?
I gave an example of getting another QWidget to be embedded and painted on top of another one. Let me know if you have any questions about how it was done.
The PopUp flag and Qt::Tool options are also relevant.
Be sure to check out: the ToolTip property of a QWidget and the WhatsThis property of QWidget.
http://qt-project.org/doc/qt-5/qwidget.html#toolTip-prop
http://qt-project.org/doc/qt-5/qwidget.html#whatsThis-prop
There are also other ways to make borderless, focusless windows that hover and disappear quickly on command. The Window Flags and Widget Attributes in Qt are very powerful when you are looking to modify Qt Widgets.
When you parent a Widget to another widget, it will draw itself on top of the other. Then you just need to resize and position it properly.
Also subclassing existing widgets can give you more options.
Draw text on scrollbar
Also common Qt::Tools that you will find are QDockWidgets. They are awesome!
Hope that helps.
Take a look at Qt Namespace especially Qt::WA_LayoutOnEntireRect and Qt::WA_StyleSheet. Pass it as a widget attrybutes. The second option looks promising but you have to create style sheet for QWidget.

layout resizing in QStackedWidget Page

I'm trying to get a widget placed on a page in a QStackedWidget to resize automatically when the parent QStackedWidget resizes. This simple task seems impossible to do with Qt Creator. Adding a layout to the page does not seem to do anything, the layout just stays at whatever size it's designed as, and will not resize. This is (I think?) because the layout is being added into the page widget as a child and not directly attached to the page widget. There seems to be no way to actually add a layout to page.
How do a get a widget to resize in a QStackedWidget with Qt Creator???
As a side comment, I really wish Qt would abandon it's layout system, it is far far harder to use then an anchoring based system.
Qt Creator treats widgets as if they already have a layout on them which you can access from the context menu (right-click) of the widget in the designer or from the widget list at the right. This means that you only have to drop layouts (from the palette) on a widget if you want to divide that top level layout into further sub layouts. The image below shows this context menu.
Notice the widget icons on the right that show a crossed-out red circle. This indicates that no top-level layout has been defined for those widgets. Once a layout type has been chosen, the red circle will disappear and the icon will reflect your layout choice.
In your case, after you drop a QStackedWidget on your main widget, you can right-click the main widget, select "Lay out" and choose "Lay Out Horizontally". This will make the stacked widget fill the entire main widget and resize with it.
Likewise, if you drop any widgets on one of the "page" widgets, you can then right-click the page widget and assign a top level layout for that which will cause those widgets to resize accordingly with the page widget.