Setting a Collapsed Splitter Panel

ComponentOne Splitter for ASP.NET AJAX: Splitter for ASP.NET AJAX Task-Based Help > Setting C1Splitter Behaviors > Setting a Collapsed Splitter Panel

To create a collapsed panel, use the Collapsed property. In this topic, you will learn how to set the Collapsed property in Design view, in Source view, and in code.

For more information on collapsed and expanded panels, see Collapsible and Expandable Panels.

In Design View

Complete the following steps:

1. Add C1Splitter to the Web form.

2. Right-click on the control and select Properties. In the Properties window, expand the Panel1 node and locate the Collapsed property.

3. Set the Collapsed property to True.

In Source View

To make Panel1 a collapsed panel, place <Panel1 MinSize="30"></Panel1> between the <cc1:C1Splitter> and </cc1:C1Splitter> tags. The final markup will resemble the following:

<cc1:C1Splitter ID="C1Splitter6" runat="server" Height="251px" Width="217px" SplitterDistance="50">

<Panel1 Collapsed=True>

</Panel1>

</cc1:C1Splitter>

In Code

Complete the following steps:

1. Import the following namespace into your project:

• Visual Basic

Imports C1.Web.UI.Controls.C1Splitter

• C#

using C1.Web.UI.Controls.C1Splitter;

2. Add the following code, which sets the Collapsed property, to the Page_Load event:

• Visual Basic

C1Splitter1.Panel1.Collapsed = True

• C#

C1Splitter1.Panel1.Collapsed = true;

3. Run the program.

$Description: D:\Whidbey\T109\C1Splitter\WordDocuments\Other Graphics\10.png$ This topic illustrates the following:

Panel1 is collapsed.

$Description: D:\Whidbey\T109\C1Splitter\WordDocuments\TBH\CollapsAndExpandFinal.png$

To expand the panel, simply click the expand button.