Changing the Background Color of Panels

ComponentOne Splitter for ASP.NET AJAX: Splitter for ASP.NET AJAX Task-Based Help > Changing the Appearance of a C1Splitter Control > Changing the Background Color of Panels

You can quickly set the background color of Panel1 or Panel2 using the BackColor property. In this topic, you'll learn how to apply different colors to each panel of the C1Splitter control in Design view, in Source view, and in code.

In Design View

Complete the following steps:

1. Add C1Splitter to the Web form.

2. Right-click on the control to open its context menu and select Properties.

3. Expand the Panel1 node to reveal its list of properties.

4. Set Panel1’s background color by completing one of the following:

• In Visual Studio 2005: Click the BackColor drop-down arrow, select the Web tab, and choose PowderBlue from the list.

• In Visual Studio 2008: Click the BackColor ellipsis button Description: ellipsis to open the More Colors dialog box and then, in the Value text box, enter “Hex={B0,E0,E6}”.

5. Expand the Panel2 node to reveal its list of properties.

6. Set Panel2’s background color by completing one of the following:

• In Visual Studio 2005: Click the BackColor drop-down arrow, select the Web tab, and choose PapayaWhip from the list.

• In Visual Studio 2008: Click the BackColor ellipsis button Description: ellipsis to open the More Colors dialog box and then, in the Value text box, enter “Hex={FF,EF,D5}”.

Panel1 appears with PowderBlue background, while Panel2 appears with a PapayaWhip background.

In Source View

To add a background color to Panel1 and Panel2, place the following markup between the <cc1:C1Splitter> and </cc1:C1Splitter> tags:

<Panel2 BackColor="PapayaWhip">

</Panel2>

<Panel1 BackColor="PowderBlue">

</Panel1>

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. Place the following code to the Page_Load event to set the BackColor properties of Panel1 and Panel2:

• Visual Basic

C1Splitter1.Panel1.BackColor = System.Drawing.Color.PowderBlue

C1Splitter1.Panel2.BackColor = System.Drawing.Color.PapayaWhip

• C#

C1Splitter1.Panel1.BackColor = System.Drawing.Color.PowderBlue;

C1Splitter1.Panel2.BackColor = System.Drawing.Color.PapayaWhip;

3. Run the program.

$Description: D:\Whidbey\T109\C1Splitter\WordDocuments\Other Graphics\10.png$ This Topic Illustrates the Following:

The image below shows Panel1 with a PowderBlue background and Panel2 with a PapayaWhip background.

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