Creating a Collapsed Topic Page

By default, a page added to the C1TopicBar control will be expanded. You can create a collapsed page by setting the Collapsed property to True. In this topic, you will learn how to set the Collapsed property using the floating toolbar, the collection editor and code.

Using the Floating Toolbar

Complete the following steps:

1. Navigate to the Toolbox and double-click the C1TopicBar icon. The C1TopicBar control is added to the form. Observe that one page, named Page 1, appears on the control by default. If you'd like to add more pages to the control, see Adding Topic Pages to the TopicBar.
2. Hover over Page1 (or another page of your choice) with your cursor until the floating toolbar appears. The topic page's toolbar appears as follows:
   
3. Click the Edit topic page appearance button to open the C1TopicPage Properties editor.
4. Select the Collapsed check box and observe that the page is now collapsed.

Using the Collection Editor

Complete the following steps:

1. Navigate to the Toolbox and double-click the C1TopicBar icon. The C1TopicBar control is added to the form. Observe that one page, named Page 1, appears on the control by default. If you'd like to add more pages to the control, see Adding Topic Pages to the TopicBar.
2. Click C1TopicBars smart tag () to open the C1TopicBar Tasks menu.
3. On the C1TopicBar Tasks menu, click Edit Pages.
   
   The C1TopicPage Collection Editor opens.
4. In the Members pane, select the page you wish to have collapsed.
5. In the Properties grid, set the Collapsed property to True.
6. Press OK to close the C1TopicPage Collection Editor and observe that the topic page is collapsed.

In Code

Complete the following steps:

1. Navigate to the Toolbox and double-click the C1TopicBar icon. The C1TopicBar control is added to the form. Observe that one page, named Page 1, appears on the control by default. If you'd like to add more pages to the control, see Adding Topic Pages to the TopicBar.

2. Click C1TopicBar's smart tag () to open the C1TopicBar Tasks menu.

3. On the C1TopicBar Tasks menu, click Edit Pages.
   
   The C1TopicPage Collection Editor opens.

4. In the Members pane, select the page you wish to have collapsed.

5. In the Properties grid, set the Tag property to “PageToCollapse”. This tag is a unique indicator that will allow you to find the appropriate page in code using the FindPageByTag method.

6. Click OK to close the C1TopicPage Collection Editor.

7. 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.

8. Add the following code to the Form_Load event. This code will find the page, assign it to a variable, and then set the page's Collapsed property to True.

   To write code in Visual Basic

   Dim c1TopicPage1 = c1TopicBar1.FindPageByTag("PageToCollapse")
   c1TopicPage1.Collapsed = True
   

   To write code in C#

   var c1TopicPage1 = c1TopicBar1.FindPageByTag("PageToCollapse");
   c1TopicPage1.Collapsed = true;
   

9. Press F5 to build the project.

See Also

Using Topic Bar ToolTips