Simple WPF Expander Example

1. Create a WPF project

   2. Add a Grid which has three rows (you can add any number of rows - here in this example, I'm going to use three expanders)

  NOTE: Make sure that the height of the row is set to Auto. This makes the expander resizable.

  3.  Now add three expanders

Use Grid.Row property to set the expanders to the grid rows.

  4. Now add some contents inside the expanders

  5. Run the program

You will see the results

The trick is setting the height of the grid row to "Auto"

This is the full Xaml Code

<Window x:Class="WpfExpander.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="MainWindow" Height="350" Width="525">

    <Grid>

        <Grid>

            <Grid.RowDefinitions>

                <RowDefinition Height="Auto" />

                <RowDefinition Height="Auto" />

                <RowDefinition Height="Auto" />

            </Grid.RowDefinitions>

            <Grid.ColumnDefinitions>

                <ColumnDefinition Width="400" />

            </Grid.ColumnDefinitions>

            

            <Expander Grid.Row="0" Header="Expander 1">

                <StackPanel>

                    <Label>This is Expander 1</Label>

                    <Button Content="Test button 1" Width="80"/>

                </StackPanel>

            </Expander>

            

            <Expander Grid.Row="1" Header="Expander 2">

                <Grid>

                    <Grid.RowDefinitions>

                        <RowDefinition Height="Auto" />

                        <RowDefinition Height="Auto" />

                        <RowDefinition Height="Auto" />

                        <RowDefinition Height="Auto" />

                    </Grid.RowDefinitions>

                    <Grid.ColumnDefinitions>

                        <ColumnDefinition Width="150" />

                        <ColumnDefinition Width="200" />

                    </Grid.ColumnDefinitions>

                    <Label Content="This is expander 2" Grid.Row="0" Grid.Column="0" />

                    <Label Content="Name" Grid.Row="1" Grid.Column="0" />

                    <Label Content="Age" Grid.Row="2" Grid.Column="0" />

                    <TextBox Grid.Row="1" Grid.Column="1" />

                    <TextBox Grid.Row="2" Grid.Column="1" />

                    <Button Content="Submit" Grid.Row="3" Grid.Column="1" Width="80"/>

                </Grid>

            </Expander>

            

            <Expander Grid.Row="2" Header="Expander 3">

                <StackPanel>

                    <Label>This is Expander 3</Label>

                    <CheckBox />

                </StackPanel>

            </Expander>

            

        </Grid>

        

    </Grid>

</Window>