Extended Library for WPF and Silverlight | ComponentOne
Accordion / Quick Start: Accordion for Silverlight / Step 2 of 4: Customizing the C1Accordion Control
In This Topic
    Step 2 of 4: Customizing the C1Accordion Control
    In This Topic

    In the last step, you created a Silverlight project and added a C1Accordion control to it. In this step, you will customize the behavior and appearance of the C1Accordion control.

    Complete the following steps:

    1. Add Height="250" to the <c1:C1Accordion> tag to set the height of the control. The XAML markup appears as follows:
    XAML
    Copy Code
    <c1:C1Accordion Height="250">
    

     

    1. Add Width="400" to the <c1:C1Accordion> tag to set the width of the control. The XAML markup appears as follows:
    XAML
    Copy Code
    <c1:C1Accordion Height="250" Width="400">
    

     

    1. Add ExpandDirection="Left" to the <c1:C1Accordion> tag so that the C1Accordion control will expand from the bottom rather than expanding from the top, which is its default. The XAML markup appears follows:
    XAML
    Copy Code
    <c1:C1Accordion Height="250" Width="400" ExpandDirection="Left">
    
    1. Add Fill="True" to the <c1:C1Accordion> tag so that each pane will expand to fill the specified width of the C1Accordion control. The XAML markup appears follows:
    XAML
    Copy Code
    <c1:C1Accordion Height="250" Width="400" ExpandDirection="Left"Fill="True">
    

     

    1. Add AllowCollapseAll="False" to the <c1:C1Accordion> tag to prevent users from collapsing all panes at the same time. The XAML markup appears follows:
    XAML
    Copy Code
    <c1:C1Accordion Height="250" Width="400" ExpandDirection="Left"Fill="True" AllowCollapseAll="False">
    

     

    In this step, you customized the appearance and behavior of the C1Accordion control. In the next step, you will add customized accordion panes to the control.