Adding Accordion Panes to the C1Accordion

In this topic, you will add an accordion pane to a C1Accordion control in Design view, in XAML, and in code.

At Design Time in Design view

To add a pane to the C1Accordion control, complete the following steps:

1. Click the C1Accordion control once to select it.
2. In the Properties window, click the Items ellipsis button. The Collection Editor: Items dialog box opens.
3. Click the Add button once to add one C1AccordionItem item to the C1Accordion control.
4. In the Properties grid, set the Width property to "150".

In XAML

To add a pane to the C1Accordion control, place the following markup between the <c1ext:C1Accordion> and </c1ext:C1Accordion> tags:

<c1ext:C1AccordionItem Name="C1AccordionItem" Width="150">
</c1ext:C1AccordionItem>

In Code

To add accordion panes in code, complete the following steps:

1. Enter Code view and import the following namespace:

   Imports C1.WPF.Extended
   

   using C1.WPF.Extended;
   

2. Add the following code beneath the InitializeComponent() method:

   'Create the accordion pane and add content
   Dim C1AccordionItem1 As New C1AccordionItem()
   C1AccordionItem1.Content = "C1AccordionItem1"
   'Add the accordion pane to the C1Accordion control
   C1Accordion1.Items.Add(C1AccordionItem1)
   

   //Create the accordion pane and add content
   C1AccordionItem C1AccordionItem1 = new C1AccordionItem();
   C1AccordionItem1.Content = "c1AccordionItem1";
   //Add the accordion pane to the C1Accordion control
   c1Accordion1.Items.Add(c1AccordionItem1);
   

3. Run the program.