c# - DockPanel 内の複数の TextBox の自動サイズ変更

Question

誰かがここで私を助けてくれることを望んでいました。ドックパネル内に 2 つのテキスト ボックスと 1 つのボタンがあり、ウィンドウ サイズに基づいて 2 つのテキスト ボックスを伸縮させたいと考えています。

左側に多数のメニュー ボタンを含むドックパネルがあり、このドック内に 2 つのテキスト ボックスとボタンを備えた別のドックがあります。メイン ウィンドウのサイズを変更するときに、右のドックでテキスト ボックスを縮小して、左のドックに当たったときに右のドックが消えないようにしたいと考えています。これは理にかなっていますか？

    <DockPanel LastChildFill="False">
        <Button DockPanel.Dock="Left" Margin="5, 0, 0, 0" Name="button1" Content="1" FontSize="10" Foreground="#FF565656" Width="64" Height="40"/>
        <Button DockPanel.Dock="Left" Margin="5, 0, 0, 0" Name="button2"  MinWidth="25" />

        <DockPanel LastChildFill="False" DockPanel.Dock="Right" Margin="5, 0, 5, 0">
                <TextBox DockPanel.Dock="Left" Name="textBoxUsername" Text="" TextWrapping="Wrap" ToolTip="Enter username" FontSize="11" FontWeight="Normal" Height="20" HorizontalAlignment="Left" Width="90" d:LayoutOverrides="GridBox" KeyUp="textBoxUsername_KeyUp" />
                <PasswordBox Margin="5, 0, 0, 0" DockPanel.Dock="Left" Name="textBoxPassword" ToolTip="Enter password" Height="20" d:LayoutOverrides="HorizontalAlignment, GridBox" Width="90" KeyUp="textBoxPassword_KeyUp" />
                <Button DockPanel.Dock="Left" Margin="5, 0, 0, 0" Name="buttonLogin" Content="Login" Height="20" MinWidth="70" Click="buttonLogin_Click" Width="500" />
            </DockPanel>
    </DockPanel>

これは現在、ウィンドウがパネル内のすべての幅より下にサイズ変更されると、右側のドックパネルがすべて一緒に消えるだけです。右側のパネル (組み込みドックパネル) のサイズを縮小したいと考えています。これは、膨大な書き直し作業なしで可能ですか? 私は明らかに多くのコードを省略しました...助けていただければ幸いです。

アップデート

私は近づいていますが、まだ私が望んでいたものではありません。グリッドを追加しました。これによりストレッチが可能になりますが、すべてを右側に固定したままにしたいと考えていました。つまり、伸ばすのではなく縮小するだけで、右に固定したいのです。

これが今の様子です。

 <DockPanel LastChildFill="False">
    <Button DockPanel.Dock="Left" Margin="5, 0, 0, 0" Name="button1" Content="1" FontSize="10" Foreground="#FF565656" Width="64" Height="40"/>
    <Button DockPanel.Dock="Left" Margin="5, 0, 0, 0" Name="button2"  MinWidth="25" />
         <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" MaxWidth="110" />
                    <ColumnDefinition Width="*" MaxWidth="110" />
                    <ColumnDefinition Width="100"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <TextBox Name="textBoxUsername" Text="" TextWrapping="Wrap" ToolTip="Enter username" FontSize="11" FontWeight="Normal" FontStyle="Normal" Foreground="#FF9C9C9C" FontFamily="Arial Unicode MS" Height="20" d:LayoutOverrides="GridBox" KeyUp="textBoxUsername_KeyUp" Margin="5,13,5,0" MaxWidth="110" VerticalAlignment="Center" HorizontalAlignment="Stretch" />
                <PasswordBox Grid.Column="1" Margin="5,13,5,0" Name="textBoxPassword" ToolTip="Enter password" Height="20" d:LayoutOverrides="HorizontalAlignment, GridBox" KeyUp="textBoxPassword_KeyUp" MaxWidth="110" VerticalContentAlignment="Center" />
                <Button Grid.Column="2" DockPanel.Dock="Left" Margin="5,13,5,0" Name="buttonLogin" Content="Login" Template="{StaticResource ButtonControlTemplate2}"  FontFamily="Arial" BorderBrush="{x:Null}" Background="{x:Null}" Height="20" MinWidth="70" Click="buttonLogin_Click" />
            </Grid>
 </DockPanel>

つまり、これはすべてをその空間の中心に置いています。水平方向の配置を「右」にするとすぐに、テキストボックスはこのように押しつぶされます

これについて何か考えはありますか？