<p> The TQt layout system provides a simple and powerful way of specifying
the layout of child widgets.
<p> By specifying the logical layout once, you get the following benefits:
<ul>
<li> Positioning of child widgets.
<li> Sensible default sizes for top-level widgets.
<li> Sensible minimum sizes for top-level widgets.
<li> Resize handling.
<li> Automatic update when contents change:
<ul>
<li> Font size, text or other contents of subwidgets.
<li> Hiding or showing a subwidget.
<li> Removal of subwidget.
</ul>
</ul>
<p> TQt's layout classes were designed for hand-written C++ code, so
they're easy to understand and use.
<p> The disadvantage of hand-written layout code is that it isn't very
convenient when you're experimenting with the design of a form and you
have to go through the compile, link and run cycle for each change.
Our solution is <ahref="designer-manual.html">TQt Designer</a>, a GUI
visual design tool which makes it fast and easy to experiment with
layouts and which generates the C++ layout code for you.
<p><h2> Layout Widgets
</h2>
<aname="1"></a><p> The easiest way to give your widgets a good layout is to use the
layout widgets: <ahref="qhbox.html">TQHBox</a>, <ahref="qvbox.html">TQVBox</a> and <ahref="qgrid.html">TQGrid</a>. A layout widget
automatically lays out its child widgets in the order they are
constructed. To create more complex layouts, you can nest layout
widgets inside each other. (Note that <ahref="qwidget.html">TQWidget</a> does not have a
layout by default, you must add one if you want to lay out widgets
inside a <ahref="qwidget.html">TQWidget</a>.)
<p><ul>
<li> A <ahref="qhbox.html">TQHBox</a> lays out its child widgets in a horizontal row, left to right.
<p><center><imgsrc="qhbox-m.png"alt="Horizontal box with five child widgets"></center>
<p><li> A <ahref="qvbox.html">TQVBox</a> lays out its child widgets in a vertical column, top to bottom.
<p><center><imgsrc="qvbox-m.png"alt="Vertical box with five child widgets"></center>
<p><li> A <ahref="qgrid.html">TQGrid</a> lays out its child widgets in a two dimensional grid.
You can specify how many columns the grid has, and it is populated left to
right, beginning a new row when the previous row is full. The grid is
fixed; the child widgets will not flow to other rows as the widget is
resized.
</ul>
<p><center><imgsrc="qgrid-m.png"alt="Two-column grid with five child widgets"></center>
<p> The grid shown above can be produced by the following code:
<pre>
<ahref="qgrid.html">TQGrid</a> *mainGrid = new <ahref="qgrid.html">TQGrid</a>( 2 ); // a 2 x n grid
new <ahref="qlabel.html">TQLabel</a>( "One", mainGrid );
new <ahref="qlabel.html">TQLabel</a>( "Two", mainGrid );
new <ahref="qlabel.html">TQLabel</a>( "Three", mainGrid );
new <ahref="qlabel.html">TQLabel</a>( "Four", mainGrid );
new <ahref="qlabel.html">TQLabel</a>( "Five", mainGrid );
</pre>
<p> You can adjust the layout to some extent by calling
<ahref="qwidget.html#setMinimumSize">TQWidget::setMinimumSize</a>() or <ahref="qwidget.html#setFixedSize">TQWidget::setFixedSize</a>() on the child widgets.
<p><h2> Adding Widgets to a Layout
</h2>
<aname="2"></a><p> When you add widgets to a layout the layout process works as follows:
<oltype=1>
<li> All the widgets will initially be allocated an amount of space in
accordance with their <ahref="qwidget.html#sizePolicy">TQWidget::sizePolicy</a>().
<li> If any of the widgets have stretch factors set, with a value
greater than zero, then they are allocated space in proportion to
their <ahref="#stretch">stretch factor</a>.
<li> If any of the widgets have stretch factors set to zero they will
only get more space if no other widgets want the space. Of these,
space is allocated to widgets with an <tt>Expanding</tt> size policy first.
<li> Any widgets that are allocated less space than their minimum size
(or minimum size hint if no minimum size is specified) are allocated
<aname="3"></a><p> If you need more control over the layout, use a <ahref="qlayout.html">TQLayout</a> subclass. The layout classes included in TQt are <ahref="qgridlayout.html">TQGridLayout</a> and <ahref="qboxlayout.html">TQBoxLayout</a>. (<ahref="qhboxlayout.html">TQHBoxLayout</a> and <ahref="qvboxlayout.html">TQVBoxLayout</a> are trivial subclasses of <ahref="qboxlayout.html">TQBoxLayout</a>,
that are simpler to use and make the code easier to read.)
<p> When you use a layout, you must insert each child both into its parent
widget (done in the constructor) and into its layout (typically done
with a function called addWidget()). This way, you can give layout
parameters for each widget, specifying properties like alignment,
stretch, and placement.
<p> The following code makes a grid like the one above, with a couple of
improvements:
<pre>
<ahref="qwidget.html">TQWidget</a> *main = new <ahref="qwidget.html">TQWidget</a>;
// make a 1x1 grid; it will auto-expand
<ahref="qgridlayout.html">TQGridLayout</a> *grid = new <ahref="qgridlayout.html">TQGridLayout</a>( main, 1, 1 );
// add the first four widgets with (row, column) addressing
grid-><ahref="qgridlayout.html#addWidget">addWidget</a>( new <ahref="qlabel.html">TQLabel</a>( "One", main ), 0, 0 );
grid-><ahref="qgridlayout.html#addWidget">addWidget</a>( new <ahref="qlabel.html">TQLabel</a>( "Two", main ), 0, 1 );
grid-><ahref="qgridlayout.html#addWidget">addWidget</a>( new <ahref="qlabel.html">TQLabel</a>( "Three", main ), 1, 0 );
grid-><ahref="qgridlayout.html#addWidget">addWidget</a>( new <ahref="qlabel.html">TQLabel</a>( "Four", main ), 1, 1 );
// add the last widget on row 2, spanning from column 0 to
// column 1, and center aligned
grid-><ahref="qgridlayout.html#addMultiCellWidget">addMultiCellWidget</a>( new <ahref="qlabel.html">TQLabel</a>( "Five", main ), 2, 2, 0, 1,
TQt::AlignCenter );
// let the ratio between the widths of columns 0 and 1 be 2:3