Changing the Visual Style

The C1TopicBar control carries several visual styles that can be added to the control by setting the VisualStyle property. This topic illustrates how change the visual style using the smart tag, the Properties window, and code.

Using the Smart Tag

Complete the following steps:

1. Navigate to the Toolbox and double-click the C1TopicBar icon to add the control to your page.
2. Click C1TopicBar's smart tag () to open the C1TopicBar Tasks menu.
3. Click the VisualStyle drop-down arrow and select a style from the list. For this example, select Office2003Olive.

The selected visual style is applied to the control.

Using the Properties Window

Complete the following steps:

1. Navigate to the Toolbox and double-click the C1TopicBar icon to add the control to your page.
2. Right-click the C1TopicBar control to open its context menu and then select Properties. The Properties window opens with the C1TopicBar control's properties in focus.
3. Locate the VisualStyle property, click its drop-down arrow, and select a visual style. For this example, select Office2003Olive.

The selected visual style is applied to the control.

Using Code

Complete the following steps:

1. Navigate to the Toolbox and double-click the C1TopicBar icon.

2. Double-click the empty portion of the form to open Code view. Notice that a Form_Load event handler has been added to Code view.

3. Import the following namespace into the project:

   To write code in Visual Basic

   Imports C1.Win.C1Command
   

   To write code in C#

   using C1.Win.C1Command;
   

4. To set the visual style, add the following code, which sets the visual style to Office2003Olive, to the Form_Load event:

   To write code in Visual Basic

   c1TopicBar1.VisualStyle = VisualStyle.Office2003Olive
   

   To write code in C#

   c1TopicBar1.VisualStyle = VisualStyle.Office2003Olive;
   

This topic illustrates the following:

In this topic, you learned how to change the visual style using three different methods. The result of this topic will look as follows:

See Also

Customizing the Expand/Collapse Behaviors