Проблема форматирования сетки WPF.

Question

Я хочу иметь Grid и две колонки, где в одной колонке у меня есть Label в другом TextBox, чтобы отобразить значение. Но, к сожалению, мои ярлыки и текстовые поля отображаются один за другим. Что я делаю неправильно? Это правильный и элегантный способ отображения информации? возможно, вы можете предложить любой другой лучший способ сделать это? Благодаря!

<StackPanel Grid.Row="0" Grid.Column="2" VerticalAlignment="Stretch">     
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*"/> 
      <ColumnDefinition Width="*"/> 
     </Grid.ColumnDefinitions> 

     <telerik:Label Grid.Column="0" Content="Name" Width="203" FontSize="16"/> 
     <telerik:Label Grid.Column="0" Content="Title" Width="203" FontSize="16"/> 
     <telerik:Label Grid.Column="0" Content="Phone" Width="203" FontSize="16"/> 
     <telerik:Label Grid.Column="0" Content="Email" Width="203" FontSize="16"/> 
     <telerik:Label Grid.Column="0" Content="Departament" Width="203" FontSize="16"/> 

     <TextBlock Grid.Column="1" x:Name="txtFullName" TextWrapping="Wrap" Height="26"/> 
     <TextBlock Grid.Column="1" x:Name ="txtTitle" TextWrapping="Wrap" Height="26"/> 
     <TextBlock Grid.Column="1" x:Name ="txtPhone" TextWrapping="Wrap" Height="26"/> 
     <TextBlock Grid.Column="1" x:Name ="txtEmail" TextWrapping="Wrap" Height="26"/> 
     <TextBlock Grid.Column="1" x:Name ="txtDepartment" TextWrapping="Wrap" Height="26"/> 

    </Grid>    
</StackPanel> 

Answer 1

Вам необходимо добавить строки в Grid. В настоящее время существует только 1 строка (так как у вас нет RowDefinitions), поэтому все элементы в каждом столбце будут просто складываться друг над другом в одной строке.

Строки сетки добавлены во многом так же, как вы добавили свои столбцы, а затем вы сообщите элементам управления, к какой строке они принадлежат, в том же порядке. Вы можете добавить строки, как следующее:

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> <!-- * is the default width, so not required --> 
     <ColumnDefinition/>   <!-- will be the same as above due to default of * --> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*"/> <!-- the * height is implied if not present --> 
     <RowDefinition Height="Auto"/> <!-- this will take up only as much space as necessary --> 
    </Grid.RowDefinitions> 

    <TextBox Grid.Column="0" Grid.Row="0" Text="Label 1"/> 
    <TextBox Grid.Column="0" Grid.Row="1" Text="Label 2"/> 
    <!-- etc... --> 
</Grid> 

ряд с высотой * будет растягиваться, чтобы заполнить свободное пространство (разделенный между всеми рядами с * высота) и ряд с высотой «Авто» будет сокращаться так что он занимает только необходимое пространство для отображения его содержимого.