Use the SplitContainer

Microsoft .NET Framework, ASP.NET, Visual C# (CSharp, C Sharp, C-Sharp) Developer Training, Visual Studio

Exam Prep. Guides

70-505 Study Guide 70-526 Study Guide

1. Forms Controls Add/configure a Form Manage control layout Group/Arrange Controls Panel GroupBox TabControl FlowLayoutPanel TableLayoutPanel SplitContainer Add/configure a control Create/configure menus Create event handlers 2. Integrating Data 3. Printing/Reporting 4. Enhancing Usability 5. Asynchronous Prog. 6. Forms Controls 7. Configure/Deploy

edit

Exam 70-526 Preparation Guide: Use the SplitContainer control to create dynamic container areas.

Contents 1 Inheritance hierarchy 2 Useful properties 3 SplitContainer Tasks 4 Adding a SplitContainer manually 5 Add a control to a SplitContainer manually 6 MSDN references

The SplitContainer control can be thought of as a composite control; effectively it is two Panel controls separated by a movable bar (also known as a splitter bar). When the mouse pointer is over the bar, the pointer changes shape to show that the bar can be moved.

Controls can be added to either Panel. This arrangement is very effective for displaying and browsing information, as per the Windows Explorer.

When a SplitContainer control is dropped onto a container (e.g. Form or other container control) the Dock property is automatically set to Fill the parent container, since this is the most common usage scenario.

This control allows for vertical or horizontal orientation and provides control over the position of the splitter, the width of the splitter and the splitter increment.

Inheritance hierarchy

System.Object 
  System.MarshalByRefObject 
    System.ComponentModel.Component 
      System.Windows.Forms.Control 
        System.Windows.Forms.ScrollableControl 
          System.Windows.Forms.ContainerControl 
            System.Windows.Forms.SplitContainer

Useful properties

• AutoScroll - This property when set to true, allows scroll bars to be displayed.

• BackColor - The background colour of the SplitContainer is defaulted to System.Drawing.SystemColors.Control, but this can be set to any colour you like. The whole of the SplitContainer changes colour, however, each Panel can have its own background colour.

• BackgroundImage - Instead of a single colour, an image can be displayed as the background. The image only appears in the splitter bar.

• BorderStyle - This property determines if the panel is outlined with no visible border (None), a plain line (FixedSingle), or a shadowed line (Fixed3D).

• Dock - Determines which SplitContainer borders are attached to the edges of the container. When a SplitContainer control is dropped onto a container, this property defaults to Fill.

• FixedPanel - Determines which SplitContainer panel remains the same size when the container is resized. This property takes a value from the FixedPanel enumeration, the default value is None:
  • None - Specifies that neither SplitContainer.Panel1, SplitContainer.Panel2 is fixed. A Control.Resize event affects both panels.
  • Panel1 - Specifies that SplitContainer.Panel1 is fixed. A Control.Resize event affects only SplitContainer.Panel2.
  • Panel2 - Specifies that SplitContainer.Panel2 is fixed. A Control.Resize event affects only SplitContainer.Panel1.

Note: This property only applies to when the SplitContainer is resized, the user can still change the size of the panel that has been fixed, by dragging the splitter bar.

• IsSplitterFixed - Gets or sets a value indicating whether the splitter is fixed or movable.

• Orientation - Gets or sets a value indicating the Horizontal or Vertical orientation of the SplitContainer panels.

• Panel1 - Gets the left panel of a vertical SplitContainer or the top panel of a horizontal SplitContainer. When you click on this property in the IDE properties pane, you can edit the properties of the underlying Panel.

• Panel1Collapsed - Determines whether Panel1 is collapsed or expanded. When this value is true, Panel1 is hidden and Panel2 expands to fill the SplitContainer. This property is mutually exclusive with Panel2Collapsed.

• Panel1MinSize - Determines the minimum distance in pixels of the splitter from the left or top edge of Panel1.

• Panel2 - Gets the right panel of a vertical SplitContainer or the bottom panel of a horizontal SplitContainer. When you click on this property in the IDE properties pane, you can edit the properties of the underlying Panel.

• Panel2Collapsed - Determines whether Panel2 is collapsed or expanded. When this value is true, Panel2 is hidden and Panel1 expands to fill the SplitContainer. This property is mutually exclusive with Panel1Collapsed.

• Panel2MinSize - Determines the minimum distance in pixels of the splitter from the right or bottom edge of Panel2.

• SplitterDistance - Determines the location of the splitter, in pixels, from the left (Orientation = Vertical) or top (Orientation = Horizontal) edge of the SplitContainer.

• SplitterIncrement - Gets or sets a value representing the increment of splitter movement in pixels.

• SplitterRectangle - Gets the size and location of the splitter relative to the SplitContainer.

• SplitterWidth - Determines the width of the splitter in pixels.

SplitContainer Tasks

Clicking on the Smart Tag icon causes a small menu to appear.

The menus items are fairly self explanatory. If you click on Undock in parent container, the form changes to something similar to this.

Adding a SplitContainer manually

The following code sample shows very simply how to add a SplitContainer to a Form.

public void CreateMySplitContainer()
{
  SplitContainer splitContainer1 = new SplitContainer();
  splitContainer1.Dock = System.Windows.Forms.DockStyle.Fill;
  splitContainer1.Location = new System.Drawing.Point(0, 0);
  splitContainer1.Name = "splitContainer1";
  splitContainer1.BorderStyle = BorderStyle.Fixed3D;
 
  this.Controls.Add(splitContainer1);
}

Add a control to a SplitContainer manually

Within the above method, a TreeView control can be added like this.

TreeView treeView1 = new TreeView();
treeView1.Dock = DockStyle.Fill;
treeView1.ForeColor = SystemColors.InfoText;
treeView1.Location = new System.Drawing.Point(0, 0);
treeView1.Name = "treeView1";
 
// Add TreeView control to Panel1 of SplitContainer
splitContainer1.Panel1.Controls.Add(treeView1);

Outside of the method, splitContainer1 must be a private member of the Form.

MSDN references

• SplitContainer Class

• SplitContainer Control (Windows Forms)