wpf - ユーザーが WPF で Expander のサイズを変更できるようにする

Question

私は 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>