Как растянуть второй элемент в горизонтальной панели стека?

Question

Мне нужно растянуть второй элемент на всей ширине горизонтально-ориентированной панели стека (текстовый блок должен быть слева, textBox должен получить все оставшееся пространство). Я много читал об этой теме, но до сих пор не могу найти ответ. Свойства HorizontalAlignment HorizontalContentAlignment не подходит, конечно. Насколько я понимаю, я должен использовать что-то другое, кроме StackPanel, потому что это зависит от размера контента. Я попытался использовать Grid Row-Columns и другие варианты, но до сих пор не могу получить то, что мне нужно. Помогите мне пожалуйста :) образцы кода и скриншот

<Grid> 
     <StackPanel> 
      <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch"> 
       <TextBlock Text="Login"></TextBlock> 
       <TextBox PlaceholderText="login" HorizontalAlignment="Stretch"/> 
      </StackPanel> 
      ... 
      more StackPanels 
      ... 
     </StackPanel> 
    </Grid> 

Answer 1

определение Используйте столбцы сетки, кажется, самый простой способ для меня. Этот пример кода должен помочь:

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="0.2*"></ColumnDefinition> 
     <ColumnDefinition Width="*"></ColumnDefinition> 
    </Grid.ColumnDefinitions> 

    <TextBlock Grid.Column="0" Text="Login" Background="Red" /> 
    <TextBox Grid.Column="1" Background="Blue"/> 
</Grid> 

Он будет отображать TextBlock влево на красном фоне (с использованием 20% доступного пространства), и текстовое поле справа с синим фоном (вытяжения на оставшееся пространство).

Вы можете отрегулировать ширину вашего текстового блока, изменив ширину определения первого столбца.

Надеюсь, это поможет.