The Why and How of the SplitContainer Control - The two orientations of SplitContainer Controls
(Page 2 of 6 )
Depending on the orientation property there are two types, the vertical which is the default, and the horizontal. Create a new Windows Application from File-->New Project after choosing Visual Basic as the project type. You can pick the Windows Application from Visual Studio's installed templates. This adds a WindowsApplication1.vb which may be changed to something of your choice. In this article it is called Vertical.vb which adds the form Vertical to the project with a default size of 300 x 300.
Now double click the SplitContainer control in the Toolbox. This adds the SplitContainer which appears as a divider of the vertical form by two panels, Panel1 and Panel2. Each of these Panels is accessed by prefixing the SplitContainer1. For example Panel1 will be SplitContainer1.Panel1. Each panel has default properties related to layout, appearance, behavior, data, and so forth.
It is possible to view the form which you may see displayed after building the project and running it as shown. You will see a thin line dividing the form. When you place your mouse on the line you will see that you can drag it to either side by moving the mouse. Sometimes you will not see this splitter in the displayed form unless you search for it with your mouse.

Accessing the properties of the SplitContainer Control
To see how the properties relate, place the following code snippet into the form's load event. The With...End With block sets the various properties such as the minimum and maximum sizes of the panels; the back color of the panel; the size of the SplitContainer; and so on. Comments have been added to the appropriate lines which should make the meaning clear.
You can also add other controls to the panels, since the main function of the panels is to support the controls placed on them, including another SplitContainer to further divide the design area, as we shall see later. In this code, a text box is added to Panel2 and a Button is added to Panel1 at run time. The messages will echo the size of the panels and the total size of the SplitContainer.
Public Class Vertical
Private Sub Vertical_Load(ByVal sender As Object, _
ByVal e As System.EventArgs) Handles Me.Load
Dim txtbox As New TextBox
txtbox.Text = "The is Panel2"
Dim btn As New Button
btn.Text = "Panel1 button"
btn.ForeColor = Color.Crimson
With SplitContainer1 .Dock = System.Windows.Forms.DockStyle.Fill
.ForeColor = System.Drawing.Color.Bisque .Location =
New System.Drawing.Point(0, 0) ' you cannot resize Panel1 to less than
25 pixels .Panel1MinSize = 25 ' you cannot approach right edge less by
less than 30 .Panel2MinSize = 30 .Size =
New System.Drawing.Size(292, 273) .SplitterDistance = 79
' This splitter moves in 10-pixel increments. .SplitterIncrement =
10 .SplitterWidth = 5 ' first element that gets tabbed is the
SplitContainer1 .TabIndex = 0 ' make Panel1's backcolor as aquamarine
.Panel1.BackColor = System.Drawing.Color.Aquamarine
End With
Debug.Print("Panel1 width: " & _
SplitContainer1.Panel1.Width & vbCrLf)
Debug.Print("Panel2 width: " & _
SplitContainer1.Panel2.Width & vbCrLf)
Debug.Print("Total width: " & _
SplitContainer1.Panel1.Width + _
SplitContainer1.Panel2.Width + _
SplitContainer1.SplitterWidth & vbCrLf)
SplitContainer1.Panel2.Controls.Add(txtbox)
SplitContainer1.Panel1.Controls.Add(btn)
End Sub
End Class
When you run this code you will see the following displayed.

The following result will be printed to the output screen.
Panel1 width: 79
Panel2 width: 208
Total width: 292
Next: Docking and Anchoring of Controls >>
More .NET Articles
More By Jayaram Krishnaswamy