newbie question: how to set a fixed height of a set of Widgets

cdvo

Hi,

I was playing around with QT Designer and stuck with layout of widgets. I used qt in the past
but I almost forgot everything. While reading books, docs, tutorials, watching videos, I would
like to post here my issue, hoping someone else could help in the meantime.

In my main window I have a first table able to resize horizontally and vertically.
On the bottom of the main window there is a second table that should be resizable only
horizontally and not vertically. The height if it must be fixed.
The bottom table has also a button on the right that must be aligned with the top edge of the table.

In a nutshell,
what I would like to have is the following:

What I get instead is the following:

How can get the first result?

Thanks

mpergand

Hi @cdvo,
It seems the first table is outside of any layout.
First create a VLayout, add the top table to it,
then add a HLayout to the VLayout.
Add the second table and the button to the HLayout.
For the button, you need to set the layout alignment to top (and to the table as well i think)

cdvo

Hi @mpergand

thanks a lot for you answer!

It seems the first table is outside of any layout.
First create a VLayout, add the top table to it,
then add a HLayout to the VLayout.
Add the second table and the button to the HLayout.

That is what I already did.

have a look:

I need a vertical spacer to push the button to the top and aligned with the bottom table. Both, the spacer and button, are inside a vertical layout. Then the bottom table and the pervious layout are in a horizontal layout. Eventually, the bottom layout and the top main table are in a vertical layout.

For the button, you need to set the layout alignment to top (and to the table as well i think)

I've never heard that and I didn't find that feature. Where is it?

Thanks

mpergand

@cdvo said in newbie question: how to set a fixed height of a set of Widgets:

I've never heard that and I didn't find that feature. Where is it?

Right click on any widget > Layout alignment > Top

cdvo

@mpergand

I don't have it!

I installed the 6.6.1 and 5.15.2 version of QT. Do I have the wrong version of QT Designer?

Thanks

mpergand

@cdvo
Put your widgets in a layout first.
Click on the background (centralwidget)
then right click > layout > lay out vertically.

from what I said in my first post, you have;

cdvo

@mpergand
I think I miss something fundamental.

The central widget is laid out vertically as in your screenshot.
The first table, the top one, belongs to the vertical layout as you can see in the Object Inspector window.

However, the button on the right of the second table, the bottom one, is positioned differently from yours
and in my case in the middle, vertically, instead of being on the top and aligned with the second table.

The Layout Alignment menu item is gray out in my case.
How did you set the push button in that way?

Thanks a lot

mpergand

@cdvo said in newbie question: how to set a fixed height of a set of Widgets:

The Layout Alignment menu item is gray out in my case.

Strange, if you try with the other widgets, does the menu grayed as well ?
You can try to right click on the button in the object tree panel in the top right corner.
I'm using Qt 5.15.2 QtCreator 10.0.1 on Mac,
but I don't think it makes any difference since it is a very old fonctionality.

cdvo

@mpergand

Thanks a lot! You found the bug.

After your comments I made a test and build the same layout with all the Designer version I have under Windows 10:

QT Designer 5.15.2 x32 -> the layout alignment works
QT Designer 5.15.2 x64 -> the layout alignment doesn't work
QT Designer 6.6.1 x64 -> the layout alignment works

Unless I messed up something with the 64 bit version of 5.15.2 Designer, then that is a bug.

Again, thanks

cdvo

Now I can come back to my initial intent.
I needed more than one push button on the right of the bottom table.
If I start with only one button top aligned and add a second button, the horizontal layout
is in charge and I get this output

It comes without saying that for getting the buttons vertically aligned, one on top of the other, I need to put them inside a vertical layout.
But once they are inside a vertical layout, they are automatically and proportionally vertical centered, even if I align
them on the top

So my initiall question was, how can I get this result with QT layouts?

Thank you!

Pl45m4

@cdvo said in newbie question: how to set a fixed height of a set of Widgets:

So my initiall question was, how can I get this result with QT layouts?

Remove the whole Layout Alignment stuff and put a vertical spacer below your buttons.
Since you are mainly using the Designer, it's simply drag'n'drop.

Or by code

QSpacerItem *vSpacer = new QSpacerItem(0,0, QSizePolicy::Minimum
                                           , QSizePolicy::Expanding);
ui->verticalLayout->addItem(vSpacer);

mpergand

@cdvo
Yeah, things starting going tricky ...

You have to add a vertical spacer after the buttons, but a border appears around the table because you set it a maximum size. Looks like a dead end ...

A solution could be to set a layout strech of 3,1 to the vertical layout (central widget).

cdvo

@Pl45m4
Already tried.

If I do that I got similar effect as in my second screenshot from the beginning of this thread.

Thanks

mpergand

@cdvo
Save this with .ui extension and have a try.

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>MainWindow</class>
 <widget class="QMainWindow" name="MainWindow">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>800</width>
    <height>600</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>MainWindow</string>
  </property>
  <widget class="QWidget" name="centralwidget">
   <layout class="QVBoxLayout" name="verticalLayout" stretch="4,1">
    <item>
     <widget class="QTableView" name="tableView"/>
    </item>
    <item>
     <layout class="QHBoxLayout" name="horizontalLayout">
      <property name="spacing">
       <number>-1</number>
      </property>
      <item>
       <widget class="QWidget" name="widget" native="true">
        <property name="sizePolicy">
         <sizepolicy hsizetype="Expanding" vsizetype="Preferred">
          <horstretch>0</horstretch>
          <verstretch>0</verstretch>
         </sizepolicy>
        </property>
        <property name="minimumSize">
         <size>
          <width>0</width>
          <height>100</height>
         </size>
        </property>
        <property name="maximumSize">
         <size>
          <width>16777215</width>
          <height>100</height>
         </size>
        </property>
        <layout class="QHBoxLayout" name="horizontalLayout_2">
         <property name="leftMargin">
          <number>0</number>
         </property>
         <property name="topMargin">
          <number>0</number>
         </property>
         <property name="rightMargin">
          <number>0</number>
         </property>
         <property name="bottomMargin">
          <number>0</number>
         </property>
         <item>
          <widget class="QTableView" name="tableView_2">
           <property name="sizePolicy">
            <sizepolicy hsizetype="Expanding" vsizetype="Expanding">
             <horstretch>0</horstretch>
             <verstretch>0</verstretch>
            </sizepolicy>
           </property>
           <property name="minimumSize">
            <size>
             <width>0</width>
             <height>0</height>
            </size>
           </property>
           <property name="maximumSize">
            <size>
             <width>16777215</width>
             <height>10000</height>
            </size>
           </property>
          </widget>
         </item>
         <item>
          <layout class="QVBoxLayout" name="verticalLayout_2">
           <property name="spacing">
            <number>-1</number>
           </property>
           <property name="sizeConstraint">
            <enum>QLayout::SetFixedSize</enum>
           </property>
           <property name="bottomMargin">
            <number>0</number>
           </property>
           <item>
            <widget class="QPushButton" name="pushButton">
             <property name="text">
              <string>PushButton</string>
             </property>
            </widget>
           </item>
           <item>
            <widget class="QPushButton" name="pushButton_2">
             <property name="text">
              <string>PushButton</string>
             </property>
            </widget>
           </item>
           <item>
            <spacer name="verticalSpacer">
             <property name="orientation">
              <enum>Qt::Vertical</enum>
             </property>
             <property name="sizeHint" stdset="0">
              <size>
               <width>20</width>
               <height>40</height>
              </size>
             </property>
            </spacer>
           </item>
          </layout>
         </item>
        </layout>
       </widget>
      </item>
     </layout>
    </item>
   </layout>
  </widget>
  <widget class="QMenuBar" name="menubar">
   <property name="geometry">
    <rect>
     <x>0</x>
     <y>0</y>
     <width>800</width>
     <height>22</height>
    </rect>
   </property>
  </widget>
  <widget class="QStatusBar" name="statusbar"/>
 </widget>
 <resources/>
 <connections/>
</ui>

Pl45m4

@cdvo said in newbie question: how to set a fixed height of a set of Widgets:

If I do that I got similar effect as in my second screenshot from the beginning of this thread.

I dont know what you did, but I can get your desired result easily by doing what I've written above.
Both button pushed to the top, and aligned with the QTableView

Result:

Edit:

Even with QTableView's vertical settings set to fixed, it works.

cdvo

@mpergand
I tested your ui file and indeed does what I expected.

The trick in your case is to wrap the bottom table and the column of buttons inside a QWidget instead of wrapping them only with the horizontal layout, isn'it?

Thanks

mpergand

@cdvo said in newbie question: how to set a fixed height of a set of Widgets:

The trick in your case is to wrap the bottom table and the column of buttons inside a QWidget instead of wrapping them only with the horizontal layout, isn'it?

Yes, because without this, only the table is size constrainted, not the buttons.

In fact you circonvent the normal behavior of layouts, so the need to fiddling around .

Actually, in cases like yours, it's more usual to use splitters instead.

cdvo

@Pl45m4

I dont know what you did,

Exactly what you suggest to do.

but I can get your desired result easily by doing what I've written above.
Both button pushed to the top, and aligned with the QTableView

I know. After that, when you lay out at the end the entire central widget you will see the vertical layout (with buttons and vertical spacer) growing more than the fixed height I wanted.

Could you please share your ui?

Thanks for your help

cdvo

@mpergand

In fact you circonvent the normal behavior of layouts, so the need to fiddling around .

My intention was to get my desired layout using only horizontal and vertical layouts, optionally with grid layouts,
and their properties.

Yes, because without this, only the table is size constrainted, not the buttons.

My knowledge of Qt is still very poor, but why the vertical layout containing the buttons and the spacer doesn't honor
the layoutSizeConstraint property set to SetFixedSize but instead grows as in my second screenshot at the top
of this thread?

Thanks

QtWS: Super Early Bird Tickets Available!

newbie question: how to set a fixed height of a set of Widgets