允许用户在 WPF 中调整 Expander 的大小

我有丰富的 C# 和 WinForms 经验，但我是 WPF 的新手。我有一个带有向下扩展的扩展器的窗口。就像我当前输入的问题框一样，我希望用户能够通过单击底部的字形（如这个问题框）并将扩展器拖动到所需的大小来动态调整扩展器的大小。

谁能提供 XAML（以及任何其他代码）来执行此操作？

这是我到目前为止所拥有的：

<Expander Header="Live Simulations" Name="expandLiveSims" Grid.Row="0" ExpandDirection="Down" IsExpanded="True">
    <Expander.Background>
        <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
            <GradientStop Color="White" Offset="0" />
            <GradientStop Color="LightGray" Offset="0.767" />
            <GradientStop Color="Gainsboro" Offset="1" />
        </LinearGradientBrush>
    </Expander.Background>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <DataGrid Height="250" Margin="5" Name="gridLiveProducts" VerticalAlignment="Top" Grid.Row="0" Grid.Column="0">
        </DataGrid>
        <GridSplitter Grid.Row="0" Grid.Column="1" Width="3" VerticalAlignment="Stretch" HorizontalAlignment="Center">
            <GridSplitter.Background>
                <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                    <GradientStop Color="White" Offset="0" />
                    <GradientStop Color="DarkGray" Offset="0.25" />
                    <GradientStop Color="DarkGray" Offset="0.75" />
                    <GradientStop Color="Gainsboro" Offset="1" /> <!-- Gainsboro matches the expander -->
                </LinearGradientBrush>
            </GridSplitter.Background>
        </GridSplitter>
        <Border Grid.Row="0" Grid.Column="2" Background="White" BorderBrush="Black" BorderThickness="1" Margin="5" >
            <Image Height="250" HorizontalAlignment="Right" Name="imgShares" Stretch="Fill" VerticalAlignment="Top" Width="250">
            </Image>
        </Border>
        <GridSplitter Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3" Height="3" HorizontalAlignment="Stretch" VerticalAlignment="Center" Margin="3">
            <GridSplitter.Background>
                <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
                    <GradientStop Color="Gainsboro" Offset="0" />
                    <GradientStop Color="DarkGray" Offset="0.25" />
                    <GradientStop Color="DarkGray" Offset="0.75" />
                    <GradientStop Color="Gainsboro" Offset="1" />
                </LinearGradientBrush>
            </GridSplitter.Background>
        </GridSplitter>
    </Grid>
</Expander>

你必须使用Grid with GridSplitter.

像这样：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Expander Grid.Row="0" Background="Azure"></Expander> <!--this is you Expander-->
    <GridSplitter Grid.Row="1" Height="10" Background="Red" ResizeDirection="Rows" HorizontalAlignment="Stretch"/> <!--this GridSplitter represents the glyph-->
</Grid>

为了以这种方式成功，牵引网格边必须为 Height="*"