TableLayoutPanel control is a container control where child controls are added within a table structure. Each cell in the table contains a single control, unless a container such as a
Panel is added first.
Assuming default values of zero for both
RowCount, this control mimics a
FlowLayoutPanel instance with
FlowDirection set to
WrapContents set to
System.Object System.MarshalByRefObject System.ComponentModel.Component System.Windows.Forms.Control System.Windows.Forms.ScrollableControl System.Windows.Forms.Panel System.Windows.Forms.TableLayoutPanel
CellBorderStyle– This property determines if the cell is outlined with a border or not. A value from the
TableLayoutPanelCellBorderStyleenumeration is required, the default value is
Inset– A single-line sunken border.
InsetDouble– A double-line sunken border.
None– No borders.
Outset– A single-line raised border.
OutsetDouble– A double-line raised border.
OutsetPartial– A single-line border containing a raised portion.
Single– A single-line border.
ColumnCount– Determines the number of columns in the table.
ColumnStyles– A collection of column styles, one for each column in the
Controls– Gets the collection of controls contained within the control.
GrowStyle– Determines whether the control should expand to accommodate new cells when all existing cells are occupied. A value from the
TableLayoutPanelGrowStyleenumeration is required, the default value is
TableLayoutPanelgains additional columns after it is full.
TableLayoutPanelgains additional rows after it is full.
TableLayoutPaneldoes not allow additional rows or columns after it is full.
RowCount– Determines the number of rows in the table.
RowStyles– A collection of row styles, one for each row in the
The menus items are pretty much self explanatory. The last menu item launches the Column and Row Styles Editor.
Column and Row Styles Editor
The behaviour of each Row and Column can be independently defined through the
ColumnStyles properties. These properties are not exposed through the properties pane of the IDE, but instead can be accessed through the virtual properties named
Columns, and the Column and Row Styles Editor.
This editor can be launched in one of three ways:
- Click on the
ColumnsCollection in the property pane of the IDE.
- Click on the
RowsCollection in the property pane of the IDE.
- The last menu item of the
TableLayoutPanelTasks menu (see above).
- Click on the
This dialog allows you to edit the
SizeType property of each of the
Rows in the
SizeType property determines how the
ColumnStyle) should be interpreted. A value from the
SizeType enumeration is required, the default value is
Absolute– The row or column should be sized to an exact number of pixels.
AutoSize– The row or column should be automatically sized to share space with its peers.
Percent– The row or column should be sized as a percentage of the parent container.
TableLayoutPanel at run time is a simple process:
// Create TableLayoutPanel TableLayoutPanel tlp = new TableLayoutPanel(); // Set the BorderStyle to Inset tlp.CellBorderStyle = TableLayoutPanelCellBorderStyle.Inset; // Grid has two columns tlp.ColumnCount = 2; // Grid has two rows tlp.RowCount = 2; // If grid is full add extra cells by adding column tlp.GrowStyle = TableLayoutPanelGrowStyle.AddColumns; // Padding (pixels)within each cell (left, top, right, bottom) tlp.Padding = new Padding(1, 1, 4, 5); // Add TableLayoutPanel to the Forms controls this.Controls.Add(tlp);
Adding controls manually
Adding a control to a
TableLayoutPanel at run time can be done in a couple of ways. Simply using the
Add method with just the name of the control adds the control to the first available cell.
// Create buttons Button button1 = new Button(); button1.Text = "Click Me"; // Add buttons to TableLayoutPanel tlp.Controls.Add(button1);
// Resize the TableLayoutPanel tlp.AutoSize = true;
Alternatively, you can place controls in exactly the cell you want them by specifying the
Column. For instance: The following code is used to add a control to the second column and the first row.
// Add buttons to TableLayoutPanel tlp.Controls.Add(button1, 1, 0);
The format for this version of the method is
public virtual void Add( Control control, int column, int row )
Row Styles manually
To change the
Style of a
Row at run time, simply set the style:
tableLayoutPanel1.ColumnStyles.SizeType = SizeType.Absolute; tableLayoutPanel1.ColumnStyles.Width = 20; tableLayoutPanel1.RowStyles.SizeType = SizeType.Percent; tableLayoutPanel1.RowStyles.Height = 50;
Cells can be merged in the
TableLayoutPanel control by setting the
RowSpan properties on a child control. To span two columns, either set the
ColumnSpan property of the control to 2, or at run time use the
To span two rows, either set the
RowSpan property of the control to 2, or at run time use the
Referenced by http://en.csharp-online.net/TableLayoutPanel