3
votes

While designing a Grid in XAMl we have to explicitly tell how many rows are going to be there in the grid.

Lets assume we are making a form type application. User needs to fill its information in it. There is a label and then there is a textbox. And this repeats like 10 times.

<Label Content="Name" />
<TextBox Text={Binding SomethingText"} />

Now this is going to repeat. Now I define a grid here.

1  <Grid>
2      <Grid.ColumnDefinitions>
3          <ColumnDefinition Width="60" />
4          <ColumnDefinition Width="*" />
5      </Grid.ColumnDefinitions>
6      <Grid.RowDefinitions>
7          <RowDefinition Height="Auto" />
8          <RowDefinition Height="Auto" />
9      </Grid.RowDefinitions>

10     <Label Grid.Row="0" Grid.Column="0" Content="Name" />
11     <TextBox Grid.Row="0" Grid.Column="1" Text="{Binding SomethingText}" />

12     <Label Grid.Row="1" Grid.Column="0" Content="Address" />
13     <TextBox Grid.Row="1" Grid.Column="1" Text="{Binding SomeText}" />
14  </Grid>

Now here if I decide to add another row in grid. Changing Grid.Row="2" will not work. It will overlap Row1. To work this fine I need to add one RowDefinition in Grid.RowDefinitions. So every time I need to add RowDefinition.

Now my question here is that is there anyway I don't need to explicitly tell RowDefinitions. WPF automatically uses last RowDefinition (line number 8).

So I want output like this. No additional RowDefinitions. Is it possible?

1  <Grid>
2      <Grid.ColumnDefinitions>
3          <ColumnDefinition Width="60" />
4          <ColumnDefinition Width="*" />
5      </Grid.ColumnDefinitions>
6      <Grid.RowDefinitions>
7          <RowDefinition Height="Auto" />
8          
9      </Grid.RowDefinitions>

10     <Label Grid.Row="0" Grid.Column="0" Content="Name" />
11     <TextBox Grid.Row="0" Grid.Column="1" Text="{Binding SomethingText}" />

12     <Label Grid.Row="1" Grid.Column="0" Content="Address" />
13     <TextBox Grid.Row="1" Grid.Column="1" Text="{Binding SomeText}" />

14     <Label Grid.Row="2" Grid.Column="0" Content="Address" />
15     <TextBox Grid.Row="2" Grid.Column="1" Text="{Binding SomeText}" />

16     <Label Grid.Row="3" Grid.Column="0" Content="Address" />
17     <TextBox Grid.Row="3" Grid.Column="1" Text="{Binding SomeText}" />
14  </Grid>
1
Due to you are using always the same controls, wouldn't it be better to create a UserControl and repeat it inside a DockPanel or StackPanel? - Herdo
What do you mean by that? - fhnaseer
I'll post you an answer. - Herdo

1 Answers

1
votes

Create an UserControl instead and repeat it in a StackPanel or Dockpanel:

<UserControl ...>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="60" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <Label x:Name="label" Grid.Row="0" Grid.Column="0"/>
        <TextBox x:Name="textBox" Grid.Row="0" Grid.Column="1"/>
    </Grid>
</UserControl>

And then in your view, either use a DockPanel:

<DockPanel>
    <c:YourUserControl DockPanel.Dock="Top" Label="Name" Value="{Binding SomethingText}"/>
    <c:YourUserControl DockPanel.Dock="Top" Label="Address" Value="{Binding SomeText}"/>
</DockPanel>

Or a StackPanel:

<StackPanel>
    <c:YourUserControl Label="Name" Value="{Binding SomethingText}"/>
    <c:YourUserControl Label="Address" Value="{Binding SomeText}"/>
</StackPanel>