How to reduce the gap between widgets inside a layout in Qt

Question

I have created a VerticalLayout in run time and added few checkbox on it. But the checkbox have huge whitspace on the top of the form. I am not able to reduce the gap between them and trim the extra whitespace on top.

Below is source code of ui and cpp file:

HideChartConfig.ui

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>HideChartConfig</class>
 <widget class="QDialog" name="HideChartConfig">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>400</width>
    <height>559</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string></string>
  </property>
  <widget class="QScrollArea" name="scrollArea">
   <property name="geometry">
    <rect>
     <x>10</x>
     <y>10</y>
     <width>381</width>
     <height>471</height>
    </rect>
   </property>
   <property name="widgetResizable">
    <bool>true</bool>
   </property>
   <widget class="QWidget" name="scrollAreaWidgetContents">
    <property name="geometry">
     <rect>
      <x>0</x>
      <y>0</y>
      <width>379</width>
      <height>469</height>
     </rect>
    </property>
   </widget>
  </widget>
  <widget class="QPushButton" name="okButton">
   <property name="geometry">
    <rect>
     <x>310</x>
     <y>510</y>
     <width>75</width>
     <height>23</height>
    </rect>
   </property>
   <property name="text">
    <string>OK</string>
   </property>
  </widget>
 </widget>
 <layoutdefault spacing="6" margin="11"/>
 <resources/>
 <connections/>
</ui>

Inside the constructor of HideChartConfig:

this->setWindowFlags(Qt::Dialog | Qt::CustomizeWindowHint | Qt::WindowTitleHint | Qt::WindowCloseButtonHint);
    ui->setupUi(this);
    QPalette pal = ui->scrollArea->palette();
    pal.setColor(QPalette::Background, Qt::white);
    ui->scrollArea->setPalette(pal);

    QWidget* container = new QWidget();
    m_ContainerLayout = new QVBoxLayout();
    container->setLayout(m_ContainerLayout);
    ui->scrollArea->setWidget(container);

    m_ContainerLayout->addStretch();

    for (int i = 0; i < 3; i++)
    {
        QCheckBox *checkbox = new QCheckBox("Hello");
        m_ContainerLayout->addWidget(checkbox, 0, Qt::AlignTop);
    }


    m_ContainerLayout->addStretch();
    m_ContainerLayout->setSpacing(0);

Also attaching screenshot for reference:

I want the checkboxes to appear on top of the form and trim the extra white space on top.

Any help is appreciated. Thanks in advance!

Answer 1

You do not have to create a new QWidget, you must use the scrollAreaWidgetContents widget and put it as a size policy that has a minimum height. In addition You must add Spacers so that it is placed properly:

setWindowFlags(Qt::Dialog | Qt::CustomizeWindowHint | Qt::WindowTitleHint | Qt::WindowCloseButtonHint);
ui->setupUi(this);
QPalette pal = ui->scrollArea->palette();
pal.setColor(QPalette::Background, Qt::white);
ui->scrollArea->setPalette(pal);

m_ContainerLayout = new QVBoxLayout(ui->scrollAreaWidgetContents);
ui->scrollArea->setSizePolicy(QSizePolicy::Minimum, QSizePolicy::Maximum);

for (int i = 0; i < 3; i++)
{
    QCheckBox *checkbox = new QCheckBox("Hello");
    m_ContainerLayout->addWidget(checkbox);
}

*.ui

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>HideChartConfig</class>
 <widget class="QDialog" name="HideChartConfig">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>400</width>
    <height>559</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string/>
  </property>
  <layout class="QVBoxLayout" name="verticalLayout">
   <item>
    <widget class="QScrollArea" name="scrollArea">
     <property name="widgetResizable">
      <bool>true</bool>
     </property>
     <widget class="QWidget" name="scrollAreaWidgetContents">
      <property name="geometry">
       <rect>
        <x>0</x>
        <y>0</y>
        <width>380</width>
        <height>249</height>
       </rect>
      </property>
     </widget>
    </widget>
   </item>
   <item>
    <spacer name="verticalSpacer">
     <property name="orientation">
      <enum>Qt::Vertical</enum>
     </property>
     <property name="sizeHint" stdset="0">
      <size>
       <width>20</width>
       <height>248</height>
      </size>
     </property>
    </spacer>
   </item>
   <item>
    <layout class="QHBoxLayout" name="horizontalLayout">
     <item>
      <spacer name="horizontalSpacer">
       <property name="orientation">
        <enum>Qt::Horizontal</enum>
       </property>
       <property name="sizeHint" stdset="0">
        <size>
         <width>40</width>
         <height>20</height>
        </size>
       </property>
      </spacer>
     </item>
     <item>
      <widget class="QPushButton" name="okButton">
       <property name="text">
        <string>OK</string>
       </property>
      </widget>
     </item>
    </layout>
   </item>
  </layout>
 </widget>
 <layoutdefault spacing="6" margin="11"/>
 <resources/>
 <connections/>
</ui>

Screenshot:

Answer 2

Try to remove the first line

m_ContainerLayout->addStretch();

It gives the space on top. (The second line gives the space on bottom.)

Answer 3

You should add a vertical QSpacerItem to the bottom of your layout container, and set it to Expanding, this will use as much space as possible at the bottom of your layout, pushing everything above it to the top.