Designer and layouts



  • I created a simple dialog using designer and grouped a few label and lineedit widgets to the grid layout and then added a vertical spring and buttonbox and grouped everything to a vboxlayout.

    however when i run the program and resize the dialog, everything remains in a fixed size.

    i want the widgets to expand, i checked their setting and the lineedit is set to horizontal expanding property.

    what did i forget to do?



  • Hard to analyze without the .ui file. Can you put it somewhere on a download page, so we can have a look at it.



  • Here is a simpler dialog using a grid layout, i have the same problem, line edit widgets don't expand on resize of dialog.

    @<?xml version="1.0" encoding="UTF-8"?>
    <ui version="4.0">
    <class>Dialog</class>
    <widget class="QDialog" name="Dialog">
    <property name="geometry">
    <rect>
    <x>0</x>
    <y>0</y>
    <width>298</width>
    <height>118</height>
    </rect>
    </property>
    <property name="windowTitle">
    <string>Dialog</string>
    </property>
    <widget class="QWidget" name="">
    <property name="geometry">
    <rect>
    <x>20</x>
    <y>10</y>
    <width>194</width>
    <height>89</height>
    </rect>
    </property>
    <layout class="QGridLayout" name="gridLayout" columnstretch="0,0">
    <property name="verticalSpacing">
    <number>0</number>
    </property>
    <item row="0" column="0">
    <widget class="QLabel" name="label">
    <property name="text">
    <string>TextLabel</string>
    </property>
    </widget>
    </item>
    <item row="0" column="1">
    <widget class="QLineEdit" name="lineEdit"/>
    </item>
    <item row="1" column="0">
    <widget class="QLabel" name="label_2">
    <property name="text">
    <string>TextLabel</string>
    </property>
    </widget>
    </item>
    <item row="1" column="1">
    <widget class="QLineEdit" name="lineEdit_2"/>
    </item>
    <item row="2" column="0">
    <widget class="QLabel" name="label_3">
    <property name="text">
    <string>TextLabel</string>
    </property>
    </widget>
    </item>
    <item row="2" column="1">
    <widget class="QLineEdit" name="lineEdit_3"/>
    </item>
    </layout>
    </widget>
    </widget>
    <layoutdefault spacing="6" margin="11"/>
    <resources/>
    <connections/>
    </ui>
    @



  • Try this one:
    @<?xml version="1.0" encoding="UTF-8"?>
    <ui version="4.0">
    <class>Dialog</class>
    <widget class="QDialog" name="Dialog">
    <property name="geometry">
    <rect>
    <x>578</x>
    <y>354</y>
    <width>253</width>
    <height>101</height>
    </rect>
    </property>
    <property name="windowTitle">
    <string>Dialog</string>
    </property>
    <layout class="QGridLayout" name="gridLayout">
    <item row="0" column="0">
    <widget class="QLabel" name="label">
    <property name="text">
    <string>TextLabel</string>
    </property>
    </widget>
    </item>
    <item row="0" column="1">
    <widget class="QLineEdit" name="lineEdit"/>
    </item>
    <item row="1" column="0">
    <widget class="QLabel" name="label_2">
    <property name="text">
    <string>TextLabel</string>
    </property>
    </widget>
    </item>
    <item row="1" column="1">
    <widget class="QLineEdit" name="lineEdit_2"/>
    </item>
    <item row="2" column="0">
    <widget class="QLabel" name="label_3">
    <property name="text">
    <string>TextLabel</string>
    </property>
    </widget>
    </item>
    <item row="2" column="1">
    <widget class="QLineEdit" name="lineEdit_3"/>
    </item>
    </layout>
    </widget>
    <layoutdefault spacing="6" margin="11"/>
    <resources/>
    <connections/>
    </ui>@
    I fixed this way:

    1. break your grid layout
    2. select the "background form" and click on grid layout


  • Thanks that worked, not intuitive!



  • [quote author="ryadav" date="1297143061"]... not intuitive![/quote]

    ryadav, after designing a few forms you'll find the designer amazing to work with. We use it quite a lot in our team and its very easy.



  • 2 ryadav, you got to think that the main_layout got to be "owned" by the window, and this main_layout will "contain" the other layouts and widgets.

    See "this documentation page":http://doc.qt.nokia.com/4.7/designer-layouts.html, my main_layout it's actually called Top Level Layout ;)



  • Zlatomir, what if i had other widgets, and i didn't want them to be a part of the grid layout? selecting the form background would select all the widgets inside the form, not what i would want.

    how would one use the designer in this case to get the same results? that is:

    select a few items and apply a layout to them
    select other items including last layout and apply a layout to them and expect stretching and expansion to work

    the way i tired it originally would seem to be the way to do things, i would just expect the layout to have expansion properties i could set



  • one container can have one layout, so add different containers and set corresponding layouts. nest them as you like ...



  • i am actually starting to understand how to use the layouts. from code a layout can contain other layout, so this should be possible via the designer without adding unnecessary widget (containers)



  • You can do that too

    You select the Widgets for Grid... (like you did the first time) and then add other Widgets... and select a Layout for the form.
    You need that (main layout) to achieve the behavior you said in the first post ;) for the rest feel free to nest them as long as you like.

    example, i used a vertical layout ;)
    @<?xml version="1.0" encoding="UTF-8"?>
    <ui version="4.0">
    <class>Dialog</class>
    <widget class="QDialog" name="Dialog">
    <property name="geometry">
    <rect>
    <x>0</x>
    <y>0</y>
    <width>298</width>
    <height>118</height>
    </rect>
    </property>
    <property name="windowTitle">
    <string>Dialog</string>
    </property>
    <widget class="QWidget" name="">
    <property name="geometry">
    <rect>
    <x>20</x>
    <y>10</y>
    <width>194</width>
    <height>89</height>
    </rect>
    </property>
    <layout class="QGridLayout" name="gridLayout" columnstretch="0,0">
    <property name="verticalSpacing">
    <number>0</number>
    </property>
    <item row="0" column="0">
    <widget class="QLabel" name="label">
    <property name="text">
    <string>TextLabel</string>
    </property>
    </widget>
    </item>
    <item row="0" column="1">
    <widget class="QLineEdit" name="lineEdit"/>
    </item>
    <item row="1" column="0">
    <widget class="QLabel" name="label_2">
    <property name="text">
    <string>TextLabel</string>
    </property>
    </widget>
    </item>
    <item row="1" column="1">
    <widget class="QLineEdit" name="lineEdit_2"/>
    </item>
    <item row="2" column="0">
    <widget class="QLabel" name="label_3">
    <property name="text">
    <string>TextLabel</string>
    </property>
    </widget>
    </item>
    <item row="2" column="1">
    <widget class="QLineEdit" name="lineEdit_3"/>
    </item>
    </layout>
    </widget>
    </widget>
    <layoutdefault spacing="6" margin="11"/>
    <resources/>
    <connections/>
    </ui>@



  • Thanks Zlatomir,

    I was playing around with designer, and I am getting the hang of how the layouts work.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.