I have a problem with showing multiple tables(without their own scrollbars) under one scrollbar. Is there any workaround or a good way to resolve this issue in Qt?
I've tried to do what you ask, and found this. So, here is a solution:
add QScrollArea to a form
set the property widgetResizable to true
put QWidget to scroll area
right click on widget -> Set ancestor -> [your scroll area]
add vertical layout to a widget
scroll area will collapse, epand it with a mouse
insert into the widget as many tables as you want
set vertical size policy for each table to Minimum and set minimal vertical size.
Here is how it looks:
Related
When I run my program it will display all content properly, and when I resizing the main window, the layout along with all associated widgets remain fixed, rather than resizing with the main window. I used to increase my all widget and listWidget respect to window computer resolution size but still this not one work properly.
I used this one code finding the system height and width.
QWidget widget;
widget.resize(widget.width(), widget.minimumHeight());
QRect rec = QApplication::desktop()->screenGeometry();
int h = rec.height();
int w = rec.width();
// Increasing the listwidget size
ui->listWidget->setFixedHeight(h);
ui->listWidget->setFixedWidth(w);
//increasing the button size
ui->pushButton->setFixedHeight(h0.2);
ui->pushButton->setFixedWidth(w0.2);
At this link you will find two screenshots that illustrate my problem.
Please resolve to solve my problem. Thanks very much in advance.
When defining the layout of your windows and forms in Qt Designer you have to define each element of your form in advance, in order to have a working layout.
This solution is based on the screenshots provided in the comments to the question. Follow these steps:
Add an empty widget to the central area of your form, if there is nothing there. It will be used as a placeholder for the controls you will add later, and of course you can replace it with whatever widget you want. But you need it there to define a proper layout.
In the property panel, set the horizontal QSizePolicy of this widget to MinimumExpanding.
Add an horizontal spacer to the left side of your progress bar.
Define a minimum/maximum width for the white widget on the left (I guess it's a text area). As an example set the maximum width to 200
pixels.
Make the same for the QTabWidget on the right.
Give a minimum height to the Groupbox on top.
Then give the grid layout to the MainWindow.
You should get something similar in the designer view (I use a dark theme, yours will have different colors of course):
If you complete all steps you should have a nicely resizing window.
For the future: remember to integrally define your layouts, also using placeholder widgets when needed, read carefully the documentation about the widgets size policies (there are several, you need to play with them to fully understand each one) and keep in mind that Qt uses a container based approach which is different, as an example from those used by the .Net framework that relies on the concept of anchors.
EDIT : to answer questions in the comments
You will need to add a layout to any widget that contains other widgets, e.g. adding controls to your groupbox will require to give it a grid, horizontal or vertical layout in order to scale nicely on resize. Again use spacers and size policies to make it look the way you want. If you need to add or remove controls, or change their positions, you may need to brake the layout, rearrange and then set it again.
You can also select groups of widgets and give them a layout e.g. vertical, than another group and set them horizontal and so on... then give a grid layout to the container widget to build a compound layout.
There are endless possibilities, you just need to practice and go through trial and error as for everything else...
You can also do it all programmatically, check the Qt widgets documentation for this. But for complex layouts I would not go that way: it's a lot of code... and you have to compile and run to test every modification.
Using the QtCreator, within the designer you can simply right-click on the parent-widget and add a Grid-Layout.
This one resizes it's children to it's dimensions.
When I maximize my window, I want to restrict a vertical layout (and the entire row below it also) so that it has a specific size (lets say a width of 200). How can I achieve this? Below is what I get now. The buttons are stretched too far. I want them to keep a width of 200.
To stop the buttons stretching, use the following steps in Qt Designer:
click on scrollArea in the Object Inspector
click on Break Layout on the toolbar
click on scrollArea in the Object Inspector
click on Lay Out in a Grid on the toolbar
click on scrollAreaWidgetContents in the Object Inspector
scroll down to the bottom of the Property Editor
change layoutColumnStretch to 0,1
These steps should remove an empty column from the scroll-area grid-layout, and make the second column stretch to take up the available space when the window is resized.
You just need to restrict the maximum width of all widgets (in this case the buttons) within the layouts of this grid column to the expected size, else they'll just keep expanding. You may also have to fiddle the horizontal size policy; I seem to remember that buttons were a bit tricky in this regard (or was that the height?), but can't test it right now.
The layout size contraint you tried only applies to the layout's direct parent widget, if it has one, which isn't the case for the vertical layouts here.
What I'm trying to accomplish is a very simple and straight forward need, or I thought, but for the life of me, I can't seem to find a way to do it.
In my qt application I want to be able to make a widget or a layout fill the entire space of the parent widget.
For example, let's say I want to have a label with a fixed height and beneath it a stacked widget which occupies the rest of the height of the window.
Here's what I do in the qt-creator designer:
drag a label to the form
drag a stacked widget to the form
select both of them and then right click > lay out > lay out vertically
select the verticalLayout object and in the layoutStretch property have 0,1
Now, how do I make the verticalLayout occupy all of the width/height of the centralWidget?
Nothing seems to work for me.
Thanks.
You've merely put two widgets in a layout, but you also need a layout on their parent widget - on the form. Here's what you should do instead:
Drag any number of widgets to the parent widget (the form). Arrange them roughly the way you want them to be once laid out.
Right click on the form. Select "Lay out >" submenu.
Choose the desired layout from the menu: horizontal, vertical, grid, etc.
I have a QScrollArea Widget, which starts empty;
It has a vertical layout, with a QGridLayout, and a vertical spacer to keep it at the top, and prevent it from stretching over the whole scroll area;
Elsewhere in the program, there is a QTextEdit, which when changed, has its contents scanned for "species" elements, and then they are added to the QGridLayout. Any species elements which have been removed are removed too. This bit works;
I have turned the vertical scrollbar on all the time, so that when it appears it does not sit on top of the other stuff in there. Note that the scroll bar is larger than the scroll box already though, despite not needing to be.
This is the problem. The scroll area seems to be preset, and i cannot change it. If i add more rows to the QGridLayout, the scroll area doesn't increase in size.
Instead, it stays the same size, and squeezes the QGridLayout, making it look ugly (at first);
And then after adding even more it becomes unusable;
Note that again, the scroll bar is still the same size as in previous images. The first two images are from Qt Designer, the subsequent 3 are from the program running.
If I resize the window so that the QScrollArea grows, then I see this:
Indicating that there's some layout inside the scroll area that is not resizing properly.
My question is; what do I need to do to make the scrollable area of the widget resize dynamically as I add and remove from the QGridLayout?
If you're coming here from Google and not having luck with the accepted answer, that's because you're missing the other secret invocation: QScrollArea::setWidget. You must create and explicitly identify a single widget which is to be scrolled. It's not enough to just add the item as a child! Adding multiple items directly to the ScrollArea will also not work.
This script demonstrates a simple working example of QScrollArea:
from PySide.QtGui import *
app = QApplication([])
scroll = QScrollArea()
scroll.setWidgetResizable(True) # CRITICAL
inner = QFrame(scroll)
inner.setLayout(QVBoxLayout())
scroll.setWidget(inner) # CRITICAL
for i in range(40):
b = QPushButton(inner)
b.setText(str(i))
inner.layout().addWidget(b)
scroll.show()
app.exec_()
The documentation provide an answer :
widgetResizable : bool
This property holds whether the scroll area should resize the view widget.
If this property is set to false (the default), the scroll area honors the size of its widget.
Set it to true.
Why don't you use a QListView for your rows, it will manage all the issues for you? Just make sure that after you add it you click on the Class (top right window of designer) and assign a layout or it wont expand properly.
I use a QLIstWidget inside a QScrollArea to make a scrollable image list
Try this for adding other objects to the list, this is how I add an image to the list.
QImage& qim = myclass.getQTImage();
QImage iconImage = copyImageToSquareRegion(qim, ui->display_image->palette().color(QWidget::backgroundRole()));
QListWidgetItem* pItem = new QListWidgetItem(QIcon(QPixmap::fromImage(iconImage)), NULL);
pItem->setData(Qt::UserRole, "thumb" + QString::number(ui->ImageThumbList->count())); // probably not necessary for you
QString strTooltip = "a tooltip"
pItem->setToolTip(strTooltip);
ui->ImageThumbList->addItem(pItem);
Update on Artfunkel's answer:
Here's a PySide6 demo that uses a "Populate" button to run the for loop adding items to the scroll area. Each button will also delete itself when clicked.
from PySide6.QtWidgets import *
app = QApplication([])
scroll = QScrollArea()
scroll.setWidgetResizable(True) # CRITICAL
inner = QFrame(scroll)
inner.setLayout(QVBoxLayout())
scroll.setWidget(inner) # CRITICAL
def on_remove_widget(button):
button.deleteLater()
def populate():
for i in range(40):
b = QPushButton(inner)
b.setText(str(i))
b.clicked.connect(b.deleteLater)
inner.layout().addWidget(b)
b = QPushButton(inner)
b.setText("Populate")
b.clicked.connect(populate)
inner.layout().addWidget(b)
scroll.show()
app.exec()
I am trying to place a set of buttons so that they are anchored to the bottom right of the screen. My problem is that whenever I resize the screen, the buttons are not anchored to the bottom right, but stay in its current position.
I have placed two Push Buttons inside a Horizontal Layout. I then placed this layout inside a Grid Layout, which contains a Horizontal and Vertical Spacer. I have modified the Grid Layout layoutSize property to SetMaximumSize.
What am I doing incorrectly, so that I can get my buttons to be anchored to the bottom right?
You have almost everything just right here, but you probably overlooked something that is really easy to miss when you first start using Qt Designer.
Your grid layout is sitting inside your widget with a fixed size and position. It too needs to be managed by a layout. If you take a look at the Object Inspector on the top right (that contains your hierarchy) you will probably see your top level widget with a red icon. This indicates that it contains no layout. You have two options to fix this...
Have your existing grid layout placed into another main layout (like a vertical layout). You would simply right click on your top level widget in the Object Inspector -> Lay Out -> [Choose a main layout type].
Have your grid be the main layout. To do this you would need to remove the grid layout and have your child items arranged exactly how you have them in that picture. Then follow the previous option, right clicking on the top level widget (or the blank background) and choose Lay out -> Grid. This will pop your widgets into a Grid at a best visual fit (which you can then fix if needed), and your grid will be the top level layout.
That grid layout will make placing other widgets quite hard. Try this instead:
Add (from left to right) horizontal spacer and the two buttons.
Multiselect them all.
Select "Lay Out Horizontally" (Ctrl-H) from the Qt Designer's (or Qt Creator's) top toolbar (not from the widget box in the left!).
Add vertical spacer on top of the previous widgets.
Select the main window by clicking it (none of the added widgets are now selected).
Select "Lay Out Vertically" (Ctrl-L) from the top toolbar.
Done.
It seems that you're doing it correctly. Just forgot to apply a layout to your central widget, right? The Grid layout should be arranged in your central widget. The more convenient way is to remove grid layout widget and lay out the central widget in a grid ;-)