WPF Layout Controls - Expander

The Expander is a standard WPF layout control.

The control has two states. In the collapsed state, which is the default, a small header and a button are visible but the child control of the Expander is hidden. When the user clicks the button the Expander grows in order to show its child control.

Expander allows its children to be hidden or displayed with a single click.

Code Behind:

  1. <Grid>  
  2.     <Grid.ColumnDefinitions>  
  3.         <ColumnDefinition Width="Auto"/>  
  4.         <ColumnDefinition/>  
  5.     </Grid.ColumnDefinitions>  
  6.     <Grid.RowDefinitions>  
  7.         <RowDefinition Height="Auto"/>  
  8.         <RowDefinition Height="Auto"/>  
  9.     </Grid.RowDefinitions>  
  10.   
  11.    <Expander Header="Show More Information" Grid.Row="1" Grid.Column="1">  
  12.         <TextBlock Margin="24 6 0 0">  
  13.         Text Line1<LineBreak/>  
  14.         1. Text Line1<LineBreak/>  
  15.         2. Text Line1<LineBreak/>  
  16.         3. Text Line1  
  17.         </TextBlock>  
  18.     </Expander>  
  19. </Grid>