Squared button in Qt Designer

Question

I'm using Qt Creator with the 'Design' tool and I have grid of buttons, which, no matter how I resize them, should always be squares.

Any ideas?

This is what my grid looks like when resized differently:

Here it is perfectly squared, but if I make my window smaller...

...it looks like this:

That's the .ui:

<layout class="QGridLayout" name="gridLayout_5" rowstretch="0,0,0" columnstretch="0,0,0">
         <property name="sizeConstraint">
          <enum>QLayout::SetMinimumSize</enum>
         </property>
         <item row="2" column="1">
          <widget class="QPushButton" name="downButton_3">
           <property name="minimumSize">
            <size>
             <width>30</width>
             <height>30</height>
            </size>
           </property>
           <property name="maximumSize">
            <size>
             <width>50</width>
             <height>50</height>
            </size>
           </property>
           <property name="layoutDirection">
            <enum>Qt::LeftToRight</enum>
           </property>
           <property name="text">
            <string/>
           </property>
           <property name="icon">
            <iconset resource="grafics.qrc">
             <normaloff>:/grafics/grafics/pfeile/pfeil_unten.tga</normaloff>:/grafics/grafics/pfeile/pfeil_unten.tga</iconset>
           </property>
           <property name="iconSize">
            <size>
             <width>50</width>
             <height>50</height>
            </size>
           </property>
          </widget>
         </item>
         <item row="0" column="1">
          <widget class="QPushButton" name="upButton_3">
           <property name="minimumSize">
            <size>
             <width>30</width>
             <height>30</height>
            </size>
           </property>
           <property name="maximumSize">
            <size>
             <width>50</width>
             <height>50</height>
            </size>
           </property>
           <property name="sizeIncrement">
            <size>
             <width>0</width>
             <height>0</height>
            </size>
           </property>
           <property name="text">
            <string/>
           </property>
           <property name="icon">
            <iconset resource="grafics.qrc">
             <normaloff>:/grafics/grafics/pfeile/pfeil_oben.tga</normaloff>:/grafics/grafics/pfeile/pfeil_oben.tga</iconset>
           </property>
           <property name="iconSize">
            <size>
             <width>50</width>
             <height>50</height>
            </size>
           </property>
          </widget>
         </item>
         <item row="1" column="1">
          <widget class="QPushButton" name="waitButton_3">
           <property name="minimumSize">
            <size>
             <width>30</width>
             <height>30</height>
            </size>
           </property>
           <property name="maximumSize">
            <size>
             <width>50</width>
             <height>50</height>
            </size>
           </property>
           <property name="font">
            <font>
             <family>MS Shell Dlg 2</family>
             <pointsize>15</pointsize>
            </font>
           </property>
           <property name="contextMenuPolicy">
            <enum>Qt::DefaultContextMenu</enum>
           </property>
           <property name="text">
            <string>W</string>
           </property>
           <property name="icon">
            <iconset theme="&amp;#9664"/>
           </property>
          </widget>
         </item>
         <item row="1" column="0">
          <widget class="QPushButton" name="leftButton_3">
           <property name="minimumSize">
            <size>
             <width>30</width>
             <height>30</height>
            </size>
           </property>
           <property name="maximumSize">
            <size>
             <width>50</width>
             <height>50</height>
            </size>
           </property>
           <property name="text">
            <string/>
           </property>
           <property name="icon">
            <iconset resource="grafics.qrc">
             <normaloff>:/grafics/grafics/pfeile/pfeil_links.tga</normaloff>:/grafics/grafics/pfeile/pfeil_links.tga</iconset>
           </property>
           <property name="iconSize">
            <size>
             <width>50</width>
             <height>50</height>
            </size>
           </property>
          </widget>
         </item>
         <item row="0" column="2">
          <widget class="QPushButton" name="deleteButton_3">
           <property name="minimumSize">
            <size>
             <width>30</width>
             <height>30</height>
            </size>
           </property>
           <property name="maximumSize">
            <size>
             <width>50</width>
             <height>50</height>
            </size>
           </property>
           <property name="font">
            <font>
             <pointsize>15</pointsize>
            </font>
           </property>
           <property name="text">
            <string>&lt;</string>
           </property>
          </widget>
         </item>
         <item row="1" column="2">
          <widget class="QPushButton" name="rightButton_3">
           <property name="minimumSize">
            <size>
             <width>30</width>
             <height>30</height>
            </size>
           </property>
           <property name="maximumSize">
            <size>
             <width>50</width>
             <height>50</height>
            </size>
           </property>
           <property name="sizeIncrement">
            <size>
             <width>0</width>
             <height>0</height>
            </size>
           </property>
           <property name="text">
            <string/>
           </property>
           <property name="icon">
            <iconset resource="grafics.qrc">
             <normaloff>:/grafics/grafics/pfeile/pfeil_rechts.tga</normaloff>:/grafics/grafics/pfeile/pfeil_rechts.tga</iconset>
           </property>
           <property name="iconSize">
            <size>
             <width>50</width>
             <height>50</height>
            </size>
           </property>
          </widget>
         </item>
        </layout>

Answer 1

Read about the Qt layouts https://doc.qt.io/qt-5/layout.html
It's a powerful way to have responsive UI and ensure your window will look good for many different sizes.

All Qt widgets have default behaviours about how to resize in the available space. You can see in your code (and in Qt Designer properties) that your buttons have min and max sizes, the layout will adapt your widget's size in this range when you resize your window, to make everything fit as much as possible.
So if your window is not squared, your content will not be squared, thanks to the top GridLayout you have.

About your question to have squared buttons, there is not straightforward property to do that, you have to code a little bit :

• How to maintain widgets aspect ratio in Qt?
• Qt layouts - Keep widget aspect ratio while resizing