Infragistics3.Wpf.DockManager.v8.1
SplitPane Class
See Also  Members   Example 
Infragistics.Windows.DockManager Namespace : SplitPane Class

A pane used in a XamDockManager that can display one or more panes stacked horizontally or vertically.

Object Model


Syntax

Visual Basic (Declaration) 
Public Class SplitPane 
   Inherits FrameworkElement
   Implements IContentPaneContainer, IPaneContainer, ISplitElementCollectionOwner 
C# 
public class SplitPane : FrameworkElement, IContentPaneContainer, IPaneContainer, ISplitElementCollectionOwner 

Example

This sample demonstrates how to create a SplitPane in the various supported pane locations (e.g. docked left) and use the SplitPane properties to control the orientation of the splitter bar between the SplitPane's children and the distribution of the size available.

Visual BasicCopy Code
Imports Infragistics.Windows.DockManager

Private Sub InitializeDmSplitPanes(ByVal dockManager As XamDockManager)
    Dim splitHorz As New SplitPane()

    ' The SplitterOrientation determine the orientation
    ' of the splitter bar used to separate the children
    splitHorz.SplitterOrientation = Orientation.Horizontal

    ' since this will be a root split pane, we will initialize
    ' the default location such that it is docked on the left
    ' edge of the dockmanager
    XamDockManager.SetInitialLocation(splitHorz, InitialPaneLocation.DockedLeft)

    ' The RelativeSize is an attached property that is used
    ' to determine the percentage of the available space that
    ' should be assigned to the pane. In this example, since
    ' the splitter orientation is horizontal only the height
    ' will affect the size. The top pane will be given 2/3
    ' of the available height since it has a relative size
    ' of 200/300 whereas the bottom pane has a relative size
    ' of 100/300.
    Dim cpTop As New ContentPane()
    cpTop.Header = "Top"
    cpTop.Content = "Top"
    SplitPane.SetRelativeSize(cpTop, New Size(100, 200))

    Dim cpBottom As New ContentPane()
    cpBottom.Header = "Bottom"
    cpBottom.Content = "Bottom"
    SplitPane.SetRelativeSize(cpTop, New Size(100, 100))

    ' note, the order in which the panes are added
    ' has an impact on their position. the first visible
    ' item is positioned on the left/top depending on
    ' the splitter orientation with the next pane following
    ' to the right/bottom respectively
    splitHorz.Panes.Add(cpTop)
    splitHorz.Panes.Add(cpBottom)

    ' create a second root split pane with a vertical splitter between
    ' the items
    Dim splitVert As New SplitPane()
    splitVert.SplitterOrientation = Orientation.Vertical
    XamDockManager.SetInitialLocation(splitVert, InitialPaneLocation.DockedBottom)

    ' Here the RelativeSize is not set so each gets an
    ' equal percentage and the available width will be
    ' evenly distributed between the panes
    Dim cpLeft As New ContentPane()
    cpLeft.Content = "Left"
    cpLeft.Header = "Left"
    splitVert.Panes.Add(cpLeft)

    Dim tgMiddle As New TabGroupPane()
    Dim cpTab1 As New ContentPane()
    cpTab1.Header = "Tab 1"
    cpTab1.Content = "1"
    tgMiddle.Items.Add(cpTab1)
    Dim cpTab2 As New ContentPane()
    cpTab2.Header = "Tab 2"
    cpTab2.Content = "2"
    tgMiddle.Items.Add(cpTab2)
    splitVert.Panes.Add(tgMiddle)

    Dim cpRight As New ContentPane()
    cpRight.Header = "Right"
    cpRight.Content = "Right"
    splitVert.Panes.Add(cpRight)

    dockManager.Panes.Add(splitHorz)
    dockManager.Panes.Add(splitVert)
End Sub
C#Copy Code
using Infragistics.Windows.DockManager;

private void InitializeDmSplitPanes(XamDockManager dockManager)
{
   SplitPane splitHorz = new SplitPane();

   // The SplitterOrientation determine the orientation
   // of the splitter bar used to separate the children
   splitHorz.SplitterOrientation = Orientation.Horizontal;

   // since this will be a root split pane, we will initialize
   // the default location such that it is docked on the left
   // edge of the dockmanager
   XamDockManager.SetInitialLocation(splitHorz, InitialPaneLocation.DockedLeft);

   // The RelativeSize is an attached property that is used
   // to determine the percentage of the available space that
   // should be assigned to the pane. In this example, since
   // the splitter orientation is horizontal only the height
   // will affect the size. The top pane will be given 2/3
   // of the available height since it has a relative size
   // of 200/300 whereas the bottom pane has a relative size
   // of 100/300.
   ContentPane cpTop = new ContentPane();
   cpTop.Header = "Top";
   cpTop.Content = "Top";
   SplitPane.SetRelativeSize(cpTop, new Size(100, 200));

   ContentPane cpBottom = new ContentPane();
   cpBottom.Header = "Bottom";
   cpBottom.Content = "Bottom";
   SplitPane.SetRelativeSize(cpTop, new Size(100, 100));

   // note, the order in which the panes are added
   // has an impact on their position. the first visible
   // item is positioned on the left/top depending on
   // the splitter orientation with the next pane following
   // to the right/bottom respectively
   splitHorz.Panes.Add(cpTop);
   splitHorz.Panes.Add(cpBottom);

   // create a second root split pane with a vertical splitter between
   // the items
   SplitPane splitVert = new SplitPane();
   splitVert.SplitterOrientation = Orientation.Vertical;
   XamDockManager.SetInitialLocation(splitVert, InitialPaneLocation.DockedBottom);

   // Here the RelativeSize is not set so each gets an
   // equal percentage and the available width will be
   // evenly distributed between the panes
   ContentPane cpLeft = new ContentPane();
   cpLeft.Content = "Left";
   cpLeft.Header = "Left";
   splitVert.Panes.Add(cpLeft);

   TabGroupPane tgMiddle = new TabGroupPane();
   ContentPane cpTab1 = new ContentPane();
   cpTab1.Header = "Tab 1";
   cpTab1.Content = "1";
   tgMiddle.Items.Add(cpTab1);
   ContentPane cpTab2 = new ContentPane();
   cpTab2.Header = "Tab 2";
   cpTab2.Content = "2";
   tgMiddle.Items.Add(cpTab2);
   splitVert.Panes.Add(tgMiddle);

   ContentPane cpRight = new ContentPane();
   cpRight.Header = "Right";
   cpRight.Content = "Right";
   splitVert.Panes.Add(cpRight);

   dockManager.Panes.Add(splitHorz);
   dockManager.Panes.Add(splitVert);
}
XAMLCopy Code
<igDock:XamDockManager>
    <igDock:XamDockManager.Panes>
        <!-- The SplitterOrientation determine the orientation 
             of the splitter bar used to separate the children 
        -->
        <igDock:SplitPane SplitterOrientation="Horizontal"
                          igDock:XamDockManager.InitialLocation="DockedLeft">
            <!-- The RelativeSize is an attached property that is used 
                 to determine the percentage of the available space that 
                 should be assigned to the pane. In this example, since
                 the splitter orientation is horizontal only the height
                 will affect the size. The top pane will be given 2/3 
                 of the available height since it has a relative size 
                 of 200/300 whereas the bottom pane has a relative size
                 of 100/300.
            -->
            <igDock:ContentPane Header="Top" Content="Top" 
                                igDock:SplitPane.RelativeSize="100, 200" />
            <!-- note, the order in which the panes are added
                 has an impact on their position. the first visible
                 item is positioned on the left/top depending on 
                 the splitter orientation with the next pane following
                 to the right/bottom respectively
            -->
            <igDock:ContentPane Header="Bottom" Content="Bottom" 
                                igDock:SplitPane.RelativeSize="100, 100" />
        </igDock:SplitPane>

        <!-- create a second root split pane with a vertical splitter 
             between the items. the "content" property of the split
             pane is its panes collection so the children elements 
             you add will be the children of the pane -->
        <igDock:SplitPane SplitterOrientation="Vertical"
                          igDock:XamDockManager.InitialLocation="DockedBottom">
            <!-- Here the RelativeSize is not set so each gets an 
                 equal percentage and the available width will be 
                 evenly distributed between the panes -->
            <igDock:ContentPane Header="Left" Content="Left" />
            <igDock:TabGroupPane>
                <igDock:ContentPane Header="Tab 1" Content="1" />
                <igDock:ContentPane Header="Tab 2" Content="2" />
            </igDock:TabGroupPane>
            <igDock:ContentPane Header="Right" Content="Right" />
        </igDock:SplitPane>
    </igDock:XamDockManager.Panes>
</igDock:XamDockManager>

See Also