This topic illustrates how to use the incremental resizing feature of the C1Splitter control. By default, the Increment property is set to 1 pixel, which allows users more control over the placement of the splitter bar. In some instances – for example, when you want to prevent the partial display of tables or images - you may want to restrict the movement of the splitter bar. In this topic, you will learn how to set the Increment in Design view, in Source view, and in code.
In Design View
Complete the following steps:
1. Add a C1Splitter control to your Web project.
2. Right-click the C1Splitter control to open its context menu, then select Properties.
The Properties window appears with C1Splitter's property list in focus.
3. Expand the ResizeSettings node to reveal the properties of the ResizeBehaviorSettings class.
4. Locate the Increment property and enter "30" into its text box.
5. Run the program and use your mouse to slowly drag the splitter bar to the left or right. As you drag the splitter bar across the control, observe that the bar jumps ahead 30 pixels with each movement.
In Source View
In Source view, place <ResizeSettings Increment="30" /> between the <cc1:C1Splitter> and </cc1:C1Splitter> tags so that the markup appears similar to the following:
<cc1:C1Splitter ID="C1Splitter1" runat="server" Height="150px" Width="250px">
<ResizeSettings Increment="30" />
</cc1:C1Splitter>
Run the program and use your mouse to slowly drag the splitter bar to the left or right. As you drag the splitter bar across the control, observe that the bar jumps ahead 30 pixels with each movement.
In Code
Complete the following steps:
1. Import the following namespace into your project:
Imports C1.Web.UI.Controls.C1Splitter
• C#
using C1.Web.UI.Controls.C1Splitter;
2. Set the Increment property to 30 by placing the following code in the Page_Load event:
C1Splitter1.ResizeSettings.Increment = "30"
• C#
C1Splitter1.ResizeSettings.Increment = "30";
3. Run the program and use your mouse to slowly drag the splitter bar to the left or right. As you drag the splitter bar across the control, observe that the bar jumps ahead 30 pixels with each movement.
|
