DCSIMG
<howto>Create an Expander Group without Code</howto> - Essential XAML

<howto>Create an Expander Group without Code</howto>

Introduction: You have a collection of items and you want to display them as an expander group. Only one expander should be opened at a time.

 

Problem: There is no expander group in WPF such as panel for RadioButton, also you don't want to write custom code, only XAML.

 

Solution: Bind the collection of items to a ListBox. Create a DataTemplate to display each item as an expander. Bind the expander IsExpanded property to the ListBoxItem.IsSelected. Override the default ListBoxItem style so it wont visualize selected state.

 

image image image

 

Code Snippet:

<DataTemplate DataType="{x:Type local:Sign}">
    <Expander Padding="4"
              IsExpanded="{Binding RelativeSource={
                    RelativeSource Mode=FindAncestor, AncestorType={
                       x:Type ListBoxItem}}, Path=IsSelected}">
        <Expander.Header>
            <TextBlock Text="{Binding Name}" ... />
        </Expander.Header>
        <DockPanel LastChildFill="True">
            <Border DockPanel.Dock="Left" CornerRadius="16" BorderBrush="WhiteSmoke" Background="AliceBlue" BorderThickness="5" HorizontalAlignment="Center" VerticalAlignment="Center">
                <Image Source="{Binding Icon}" Width="90" Height="90" Stretch="Fill" />
            </Border>
            ...
        </DockPanel>                
    </Expander>
</DataTemplate>
 
<ListBox ItemsSource="{Binding Path=Signs}" />
 

* There is another solution, you can create a RadioButton control template to be displayed as expander

Download the code from here.

Published Monday, August 04, 2008 4:58 PM by Tomer Shamam

Comments

# re: <howto>Create an Expander Group without Code</howto>

Friday, January 29, 2010 7:01 AM by Flynn

exactly what I am looking for! Thanks

# re: <howto>Create an Expander Group without Code</howto>

Wednesday, November 07, 2012 3:29 PM by Luke

Excellent post. It really helped me

Leave a Comment

(required) 
(required) 
(optional)
(required) 

Enter the numbers above:
Powered by Community Server (Commercial Edition), by Telligent Systems