The grid layout manager arranges the items in a two dimensional grid. Widgets can be placed into the grid's cells and may span multiple rows and columns.
This image show two nested grids with column and row spans.
The grid arranges the child widgets in a two dimensional grid. Each child is associated with a grid column and row. Widgets can span multiple cells by setting the colSpan and rowSpan layout properties. However each grid cell can only contain one widget. Thus child widgets can never overlap.
The grid computes the preferred with/height of each column/row based on the preferred size of the child widgets. The computed column widths and row heights can be overridden by explicitly setting them using setColumnWidth and setRowHeight. Minimum and maximum sizes for columns/rows can be set as well.
By default no column or row is stretched if the available space is larger/smaller than the needed space. To allow certain rows/columns to be stretched each row/column can have a flex value.
Here are some links that demonstrate the usage of the layout: