Classes: \helpref{wxSizer}{wxsizer}, \helpref{wxGridSizer}{wxgridsizer},
\helpref{wxFlexGridSizer}{wxflexgridsizer}, \helpref{wxBoxSizer}{wxboxsizer},
\helpref{wxStaticBoxSizer}{wxstaticboxsizer},
-\helpref{wxNotebookSizer}{wxnotebooksizer}
+\helpref{CreateButtonSizer}{createbuttonsizer}
Sizers, as represented by the wxSizer class and its descendants in
-the wxWindows class hierarchy, have become the method of choice to
-define the layout of controls in dialogs in wxWindows because of
+the wxWidgets class hierarchy, have become the method of choice to
+define the layout of controls in dialogs in wxWidgets because of
their ability to create visually appealing dialogs independent of the
platform, taking into account the differences in size and style of
-the individual controls. Unlike the original wxWindows Dialog Editor,
-editors such as wxDesigner, wxrcedit, XRCed and wxWorkshop create dialogs based exclusively on sizers,
+the individual controls. Unlike the original wxWidgets Dialog Editor,
+editors such as wxDesigner, DialogBlocks, XRCed and wxWorkshop create dialogs based exclusively on sizers,
practically forcing the user to create platform independent layouts without compromises.
The next section describes and shows what can be done with sizers.
The following sections briefly describe how to program with individual sizer classes.
-For information about the new wxWindows resource system, which can describe
+For information about the new wxWidgets resource system, which can describe
sizer-based dialogs, see the \helpref{XML-based resource system overview}{xrcoverview}.
\subsection{The idea behind sizers}\label{ideabehindsizers}
-The layout algorithm used by sizers in wxWindows is closely related to layout
+The layout algorithm used by sizers in wxWidgets is closely related to layout
systems in other GUI toolkits, such as Java's AWT, the GTK toolkit or the Qt toolkit. It is
based upon the idea of individual subwindows reporting their minimal required
size and their ability to get stretched if the size of the parent window has changed.
and thus does not interfere with tab ordering and requires very few resources compared
to a real window on screen.
-What makes sizers so well fitted for use in wxWindows is the fact that every control
+What makes sizers so well fitted for use in wxWidgets is the fact that every control
reports its own minimal size and the algorithm can handle differences in font sizes
or different window (dialog item) sizes on different platforms without problems. For example, if
the standard font as well as the overall design of Linux/GTK widgets requires more space than
on Windows, the initial dialog size will automatically be bigger on Linux/GTK than on Windows.
-There are currently five different kinds of sizers available in wxWindows. Each represents
-either a certain way to lay out dialog items in a dialog or it fulfils a special task
+There are currently five different kinds of sizers available in wxWidgets. Each represents
+either a certain way to lay out dialog items in a dialog or it fulfills a special task
such as wrapping a static box around a dialog item (or another sizer). These sizers will
be discussed one by one in the text below. For more detailed information on how to use sizers
programmatically, please refer to the section \helpref{Programming with Sizers}{boxsizerprogramming}.
{\bf A minimal size:} This minimal size is usually identical to
the initial size of the controls and may either be set explicitly in the wxSize field
-of the control constructor or may be calculated by wxWindows, typically by setting
+of the control constructor or may be calculated by wxWidgets, typically by setting
the height and/or the width of the item to -1. Note that only some controls can
calculate their size (such as a checkbox) whereas others (such as a listbox)
don't have any natural width or height and thus require an explicit size. Some controls
can calculate their height, but not their width (e.g. a single line text control):
-\center{
-\image{}{sizer03.gif}
+\newcommand{\myimage}[1]{\mbox{\image{0cm;0cm}{#1}}}
-\image{}{sizer04.gif}
-
-\image{}{sizer05.gif}
-}
+\begin{center}
+\myimage{sizer03.eps}\gifsep
+\myimage{sizer04.eps}\gifsep
+\myimage{sizer05.eps}
+\end{center}
{\bf A border:} The border is just empty space and is used to separate dialog items
in a dialog. This border can either be all around, or at any combination of sides
explicitly, typically 5 points. The following samples show dialogs with only one
dialog item (a button) and a border of 0, 5, and 10 pixels around the button:
-\center{
-\image{}{sizer00.gif}
-
-\image{}{sizer01.gif}
-
-\image{}{sizer02.gif}
-}
+\begin{center}
+\myimage{sizer00.eps}\gifsep
+\myimage{sizer01.eps}\gifsep
+\myimage{sizer02.eps}
+\end{center}
{\bf An alignment:} Often, a dialog item is given more space than its minimal size
plus its border. Depending on what flags are used for the respective dialog
sample shows a listbox and three buttons in a horizontal box sizer; one button
is centred, one is aligned at the top, one is aligned at the bottom:
-\center{
-\image{}{sizer06.gif}
-}
+\begin{center}
+\myimage{sizer06.eps}
+\end{center}
{\bf A stretch factor:} If a sizer contains more than one child and it is offered
more space than its children and their borders need, the question arises how to
whereas the other two buttons have a stretch factor of zero and keep their
initial width:
-\center{
-\image{}{sizer07.gif}
-}
+\begin{center}
+\myimage{sizer07.eps}
+\end{center}
Within wxDesigner, this stretch factor gets set from the {\it Option} menu.
+\subsubsection{Hiding controls using sizers}\label{sizershiding}
+
+You can hide controls contained in sizers the same way you would hide any control,
+using the \helpref{wxWindow::Show}{wxwindowshow} method.
+
+However, wxSizer also offers a separate method which can tell the sizer not to
+consider that control in its size calculations. To hide a window using the sizer,
+call \helpref{wxSizer::Show}{wxsizershow}. You must then call Layout on the sizer
+to force an update.
+
+This is useful when hiding parts of the interface, since you can avoid removing
+the controls from the sizer and having to add them back later.
+
+Note: This is supported only by wxBoxSizer and wxFlexGridSizer.
+
\wxheading{wxBoxSizer}
\helpref{wxBoxSizer}{wxboxsizer} can lay out its children either vertically
The following sample shows the same dialog as in the last sample,
only the box sizer is a vertical box sizer now:
-\center{
-\image{}{sizer08.gif}
-}
+\begin{center}
+\myimage{sizer08.eps}
+\end{center}
\wxheading{wxStaticBoxSizer}
\helpref{wxStaticBoxSixer}{wxstaticboxsizer} is the same as a wxBoxSizer, but surrounded by a
static box. Here is a sample:
-\center{
-\image{}{sizer09.gif}
-}
+\begin{center}
+\myimage{sizer09.eps}
+\end{center}
\wxheading{wxGridSizer}
of columns or the number or rows is fixed and the grid sizer will grow
in the respectively other orientation if new children are added:
-\center{
-\image{}{sizer10.gif}
-}
+\begin{center}
+\myimage{sizer10.eps}
+\end{center}
For programming information, see \helpref{wxGridSizer}{wxgridsizer}.
Another two-dimensional sizer derived from
wxGridSizer. The width of each column and the height of each row
-are calculated individually according the minimal requirements
+are calculated individually according to the minimal requirements
from the respectively biggest child. Additionally, columns and
rows can be declared to be stretchable if the sizer is assigned
-a size different from that which it requested. The following sample shows
+a size different from the one it requested. The following sample shows
the same dialog as the one above, but using a flex grid sizer:
-\center{
-\image{}{sizer11.gif}
-}
-
-\wxheading{wxNotebookSizer}
-
-\helpref{wxNotebookSizer}{wxnotebooksizer} can be used in
-connection with notebooks. It calculates the size of each
-notebook page and sets the size of the notebook to the size
-of the biggest page plus some extra space required for the
-notebook tabs and decorations.
+\begin{center}
+\myimage{sizer11.eps}
+\end{center}
\subsection{Programming with wxBoxSizer}\label{boxsizerprogramming}
It is the unique feature of a box sizer, that it can grow in both directions (height and
width) but can distribute its growth in the main direction (horizontal for a row) {\it unevenly}
among its children. In our example case, the vertical sizer is supposed to propagate all its
-height changes to only the text area, not to the button area. This is determined by the {\it option} parameter
+height changes to only the text area, not to the button area. This is determined by the {\it proportion} parameter
when adding a window (or another sizer) to a sizer. It is interpreted
as a weight factor, i.e. it can be zero, indicating that the window may not be resized
at all, or above zero. If several windows have a value above zero, the value is interpreted
0, // make vertically unstretchable
wxALIGN_CENTER ); // no border and centre horizontally
- SetAutoLayout( TRUE ); // tell dialog to use sizer
- SetSizer( topsizer ); // actually set the sizer
+ SetSizer( topsizer ); // use the sizer for layout
- topsizer->Fit( this ); // set size to minimum size as calculated by the sizer
- topsizer->SetSizeHints( this ); // set size hints to honour mininum size
+ topsizer->SetSizeHints( this ); // set size hints to honour minimum size
}
\end{verbatim}
+Note that the new way of specifying flags to wxSizer is via \helpref{wxSizerFlags}{wxsizerflags}. This class greatly eases the burden of passing flags to a wxSizer.
+
+Here's how you'd do the previous example with wxSizerFlags:
+
+\begin{verbatim}
+// we want to get a dialog that is stretchable because it
+// has a text ctrl at the top and two buttons at the bottom
+
+MyDialog::MyDialog(wxFrame *parent, wxWindowID id, const wxString &title )
+ : wxDialog(parent, id, title, wxDefaultPosition, wxDefaultSize,
+ wxDEFAULT_DIALOG_STYLE | wxRESIZE_BORDER)
+{
+ wxBoxSizer *topsizer = new wxBoxSizer( wxVERTICAL );
+
+ // create text ctrl with minimal size 100x60 that is horizontally and
+ // vertically stretchable with a border width of 10
+ topsizer->Add(
+ new wxTextCtrl( this, -1, "My text.", wxDefaultPosition, wxSize(100,60), wxTE_MULTILINE),
+ wxSizerFlags(1).Align().Expand().Border(wxALL, 10));
+
+ wxBoxSizer *button_sizer = new wxBoxSizer( wxHORIZONTAL );
+
+ //create two buttons that are horizontally unstretchable,
+ // with an all-around border with a width of 10 and implicit top alignment
+ button_sizer->Add(
+ new wxButton( this, wxID_OK, "OK" ),
+ wxSizerFlags(0).Align().Border(wxALL, 10));
+
+ button_sizer->Add(
+ new wxButton( this, wxID_CANCEL, "Cancel" ),
+ wxSizerFlags(0).Align().Border(wxALL, 10));
+
+ //create a sizer with no border and centered horizontally
+ topsizer->Add(
+ button_sizer,
+ wxSizerFlags(0).Center() );
+
+ SetSizer( topsizer ); // use the sizer for layout
+
+ topsizer->SetSizeHints( this ); // set size hints to honour minimum size
+}
+\end{verbatim}
+
+
\subsection{Programming with wxGridSizer}\label{gridsizerprogramming}
\helpref{wxGridSizer}{wxgridsizer} is a sizer which lays out its children in a two-dimensional
rows or all columns are not necessarily the same height or width as in
the \helpref{wxGridSizer}{wxgridsizer}.
-\subsection{Programming with wxNotebookSizer}\label{notebooksizerprogramming}
-
-\helpref{wxNotebookSizer}{wxnotebooksizer} is a specialized sizer to make sizers work in connection
-with using notebooks. This sizer is different from any other sizer as
-you must not add any children to it - instead, it queries the notebook class itself.
-The only thing this sizer does is to determine the size of the biggest
-page of the notebook and report an adjusted minimal size to a more toplevel
-sizer.
+\subsection{Programming with wxStaticBoxSizer}\label{staticboxsizerprogramming}
-In order to query the size of notebook page, this page needs to have its
-own sizer, otherwise the wxNotebookSizer will ignore it. Notebook pages
-get there sizer by assiging one to them using \helpref{wxWindow::SetSizer}{wxwindowsetsizer}
-and setting the auto-layout option to TRUE using
-\helpref{wxWindow::SetAutoLayout}{wxwindowsetautolayout}. Here is one
-example showing how to add a notebook page that the notebook sizer is
-aware of:
+\helpref{wxStaticBoxSizer}{wxstaticboxsizer} is a sizer derived from wxBoxSizer but adds a static
+box around the sizer. Note that this static box has to be created
+separately.
-\begin{verbatim}
- wxNotebook *notebook = new wxNotebook( &dialog, -1 );
- wxNotebookSizer *nbs = new wxNotebookSizer( notebook );
+\subsection{CreateButtonSizer}\label{createbuttonsizer}
- // Add panel as notebook page
- wxPanel *panel = new wxPanel( notebook, -1 );
- notebook->AddPage( panel, "My Notebook Page" );
+As a convenience, CreateButtonSizer ( long flags ) can be used to create a standard button sizer
+in which standard buttons are displayed. The following flags can be passed to this function:
- wxBoxSizer *panelsizer = new wxBoxSizer( wxVERTICAL );
- // Add controls to panel and panelsizer here...
+\begin{verbatim}
+ wxYES_NO // Add Yes/No subpanel
+ wxYES // return wxID_YES
+ wxNO // return wxID_NO
+ wxNO_DEFAULT // make the wxNO button the default, otherwise wxYES or wxOK button will be default
+
+ wxOK // return wxID_OK
+ wxCANCEL // return wxID_CANCEL
+ wxHELP // return wxID_HELP
+
+ wxFORWARD // return wxID_FORWARD
+ wxBACKWARD // return wxID_BACKWARD
+ wxSETUP // return wxID_SETUP
+ wxMORE // return wxID_MORE
- panel->SetAutoLayout( TRUE );
- panel->SetSizer( panelsizer );
\end{verbatim}
-
-\subsection{Programming with wxStaticBoxSizer}\label{staticboxsizerprogramming}
-
-\helpref{wxStaticBoxSizer}{wxstaticboxsizer} is a sizer derived from wxBoxSizer but adds a static
-box around the sizer. Note that this static box has to be created
-separately.
-