Автоматическое определение размера нескольких текстовых полей в DockPanel

Question

Я надеялся, что кто-то может помочь мне здесь. У меня есть 2 текстовых поля и кнопка внутри док-панели, и я бы хотел, чтобы 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 исчезает все вместе, когда при изменении размера окна ниже ширинов всего в панели. Я хотел бы, чтобы правая панель (встроенная док-панель) уменьшалась. Возможно ли это без огромного усилия по повторной записи? Я, очевидно, оставил много кода ... Любая помощь была бы оценена.

UPDATE

Я все ближе, но все-таки не совсем то, что я надеялся. Я добавил сетку, это позволяет растягивать, но я надеялся оставить все неподвижное вправо. Смысл, я только хочу сжиматься, а не растягиваться, но он должен быть закреплен вправо.

Вот как оно выглядит сейчас.

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

Таким образом, это центрирует все, что находится внутри пространства. Как только я положил горизонтальное выравнивание на «правый», то Textboxes помялись как этого

мысли по этому поводу?

Answer 1

Это происходит из-за приоритета содержимого текстового поля. Собственная ширина TextBox будет всегда равна его содержимому, поэтому, если вы хотите, чтобы некоторые текстовые поля имели другое значение, вы должны либо установить их свойство Width, либо установить свойство своего родителя Width.

Вы могли бы меня интересует решение либо это:

<TextBox Name="textBoxUsername" Width="100" ... /> 

Или это:

... 
<ColumnDefinition Width="110" /> 
<ColumnDefinition Width="110" /> 
<ColumnDefinition Width="100" /> 
... 

Или даже так:

<TextBox Name="textBoxUsername" MinWidth="100" ... /> 

Обратите внимание на MinWidth свойство.