WPF Grid Row Height = Column Width

0
votes

I'm new to WPF and I'm trying to do following:

  • I want to set the Column0 width equal to the Row0 height.
  • The width of all the columns should be same.
  • The height/width of grid should not be constant.

But the Grid height is not becoming same as the Grid width. Here is my WPF Grid code:

    <Grid.ColumnDefinitions>
        <ColumnDefinition x:Name="Column0" Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition x:Name="Row0" Height="{Binding ElementName=grid,
            Path=ColumnDefinitions[0].Width}" />
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
2
wpf

2 Answers

1
votes

You could manage the size with a control situated at Row 0 / Column 0 in the Grid:

<Grid x:Name="LeGrid">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <Label Grid.Row="0"
           Grid.Column="0"
           Width="{Binding ElementName=LeGrid, Path=ColumnDefinitions[0].Width}"
           Height="{Binding RelativeSource={RelativeSource Self}, Path=ActualWidth}"
           Content="First" />

</Grid>
0
votes

The way I usually do something like this is to use a rectangle. I set the fill to transparent, it's blue here so you can see it working.

<Grid Name="grid">
    <Grid.ColumnDefinitions>
        <ColumnDefinition x:Name="Column0" Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="{Binding ElementName=measurer, Path=ActualWidth}" />
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Rectangle Fill="Blue" Name="measurer"/>
</Grid>