Button resizing how and where?

SPlatten

I'm working on a smart card reading device ACR890, the operating system is Linux and the SDK is for Qt. The device comes with a sample application "ACR890_Sample_Codes", I have the source code to this application and am running it remotely.

One part of this application has a WiFi set-up wizard, which I've looked at in Qt Creator, there are several widgets in the form. The first allows the user to select a WiFi network and then press the Enter button. On pressing Enter the initial widget is hidden and the password widget is then displayed. This has a keyboard containing 42 pushbuttons. In Qt Creator these buttons are large and go off the display, when the application is running the buttons all fit nicely into the form.

Its this that I don't understand how or where it is being done, I've looked at form and source code over and over and I cannot see anything that causes the buttons to be resized or rescaled to fit, can anyone help?

I've attached the XML for the user interface and the classes associated with it. Unfortunately I don't have enough privileges to upload the files and they are to big to include in this post.

[0_1562244228342_DialogWifi.h](Uploading 100%)
[3_1562244243069_WifiScan.h](Uploading 100%) [2_1562244243068_WifiScan.cpp](Uploading 100%) [1_1562244243068_DialogWifi.ui](Uploading 100%) [0_1562244243068_DialogWifi.cpp](Uploading 100%)

SPlatten

Fixed, the problem was that the width of one of the geometry fields wasn't the same, having compared the XML again I found and corrected this, now it's ok.

I believe there is a bug in Qt Creator, either that or undesirable behaviour in that on the form I have a QGridLayout if set the geometry of the object to what I want and save its ok, but if I go back in and add something else to the form or edit one of the other controls, when the layout is saved the geometry for the QGridLayout is modified (not by me) and this breaks the layout as the buttons contained within it no longer scale correctly.

mrjj

Hi
The file upload here is broken so sadly we cant see the files :(

JonB

@SPlatten
One possibility is it's done via stylesheets?

SPlatten

@mrjj, sadly I can't upload the files and I can't embed the content either the forum won't let me.

SPlatten

@JonB, Sorry, I should have said, I've copied this ui and the source and pasted into a new ui, so all the settings should be the same, but the new version doesn't behave the same way and it doesn't rescale the buttons.

As far as I can see none of the buttons or layouts have any stylesheet settings. The container for the buttons is the QGridLayout.

SPlatten

Please see this link which I've included a couple of images which I hope will help:

https://stackoverflow.com/questions/56889011/how-is-this-qt-application-resizing-the-buttons-to-fit

JKSH

@SPlatten said in Button resizing how and where?:

Its this that I don't understand how or where it is being done, I've looked at form and source code over and over and I cannot see anything that causes the buttons to be resized or rescaled to fit, can anyone help?

A layout is responsible for sizing and positioning the widgets within itself. See https://doc.qt.io/qt-5/layout.html The photo you posted on StackOverflow shows a 4x13 QGridLayout.

However, the layout will only scale to the dimensions of its container if it has been applied to the container.

The "messiness" of your screenshot in Qt Creator/Qt Designer tells me that your layout is "floating", and has not been properly applied to its parent widget:

I don't know how the original author did it, but the results are only valid for that OS and screen resolution. It is not portable or scalable.

Anyway, you can create a proper grid that scales on your PC like this:

#include <QApplication>
#include <QWidget>
#include <QGridLayout>
#include <QPushButton>

static const QVector<QStringList> characters
{
	QStringList{"~", "!", "@", "#", "$", "%", "^", "&", "*", "(", ")", "_", "+"},
	QStringList{"`", "1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "-", "="},
	QStringList{"[", "]", "\\", ";", " ", ",", ".", "/", "{", "}", "|", ":", "\""},
	QStringList{"<", ">", "?"}
};

int main(int argc, char **argv)
{
	QApplication app(argc, argv);

	auto grid = new QGridLayout;
	for (int r = 0; r < characters.count(); ++r)
	{
		for (int c = 0; c < characters[r].count(); ++c)
		{
			auto button = new QPushButton(characters[r][c]);
			button->setMinimumSize(20, 20);
			button->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
			grid->addWidget(button, r, c);
		}
	}

	QWidget topLevel;
	topLevel.setLayout(grid); // This step makes the layout scale with the top-level widget
	topLevel.show();

	return app.exec();
}

Run the program on your PC, resize the program window, and watch the buttons change shape.

If you really want to know how the original author did it, look up the generated code. The XML file gets converted into C++ code at compile-time -- look for a file called ui_DisplayWifi.h in your build folder.

SPlatten

I didn't create the layout that is a direct screenshot from the sample application which does work, mine copy of it does not.

JKSH

@SPlatten said in Button resizing how and where?:

I didn't create the layout that is a direct screenshot from the sample application which does work, mine copy of it does not.

I provided some information and hints in my previous post. Do you have any further questions?

SPlatten

Yes, this morning I launched the original application and this is what I found in the UI using Qt Creator:

The UI geometry [(0,0), 240 x 320]
This contains a QWidget called WidgetPassword with geometry [(0,40) 240 x 281]
The QGridLayout is a child of WidgetPassword, layoutSizeConstraint: SetDefaultConstraint

My copy of this form, which is slightly different but nothing that should make a difference:

The UI geometry [(0,0), 240 x 300] because I shift the form down in the display by 20 pixels.
This contains a QWidget called WidgetPassword with geometry [(0,40) 240 x 211]
The QGridLayout is a child of WidgetPassword, layoutSizeConstraint: SetDefaultConstraint

I've just noticed the difference in geometry width for the widget parent, I'm rebuilding now after changing this to match the original.

[Edit] damit, thought that was going to be it, no change.

J.Hilk

@SPlatten Inspect the associated c++ class, maybe the original author reparented or did some other Layout management there.

I had to do that once, as the Designer wouldn't let me assign a Layout to the pages of a StackedWidget...

SPlatten

@J-Hilk , If they did its so subtle and badly commented, I'm now going to compare all the files to try and find something including the XML.

After comparing the files I found nothing, still the same problem and still a mystery.

SPlatten

Fixed, the problem was that the width of one of the geometry fields wasn't the same, having compared the XML again I found and corrected this, now it's ok.

I believe there is a bug in Qt Creator, either that or undesirable behaviour in that on the form I have a QGridLayout if set the geometry of the object to what I want and save its ok, but if I go back in and add something else to the form or edit one of the other controls, when the layout is saved the geometry for the QGridLayout is modified (not by me) and this breaks the layout as the buttons contained within it no longer scale correctly.