CODEWITHSUNDEEP
wpfxaml
causa prima
causa prima

Reputation: 1712

WPF reference width of grid column

Is there a more elegant way than the one I found to reference the width of a grid column for the construction of a embedded grid? Can't I access the actual width of a certain grid's column in a better way? Could I also have a two-way connection, so that if a column in the child-grid gets too wide, the column in the parent grows to fit the content?

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Grid>  
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="auto" />
        <ColumnDefinition Width="0.5*" />
        <ColumnDefinition Width="auto" />
        <ColumnDefinition Width="0.5*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="26" />
        <RowDefinition Height="26" />
    </Grid.RowDefinitions>

    <Label Grid.Row="0" Grid.Column="0" x:Name="col0" Content="This"/>
    <Label Grid.Row="0" Grid.Column="1" x:Name="col1" Content="is"/>
    <Label Grid.Row="0" Grid.Column="2" x:Name="col2" Content="a"/>
    <Label Grid.Row="0" Grid.Column="3" x:Name="col3" Content="test."/>

    <Grid Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2">
        <Grid.ColumnDefinitions>
          <ColumnDefinition Width="{Binding Path=ActualWidth, ElementName=col0}" />
          <ColumnDefinition Width="{Binding Path=ActualWidth, ElementName=col1}" />     
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
          <RowDefinition />
        </Grid.RowDefinitions>

        <Label Grid.Row="0" Grid.Column="0" VerticalAlignment="Center" Content="The" />
        <Label Grid.Row="0" Grid.Column="1" VerticalAlignment="Center" Content="same width" />                  
      </Grid>

  </Grid>
</Page>

Upvotes: 1

Views: 1063

Answers (1)

Tony Vitabile
Tony Vitabile

Reputation: 8614

The Grid control supports a number of "Same Size" properties that let you specify that columns or rows in the Grid should all be the same size, without you having to worry about what those sizes are.

To use it, add the IsSharedSizeScope attached property to the Grid control:

<Grid Name="Root" Grid.IsSharedSizeScope="True">
    . . .
</Grid>

Then, on the columns that you want to be the same size, you specify a name for the SharedSizeGroup property:

<Grid Name="Root" Grid.IsSharedSizeScope="True">
    <Grid Name="InnerGrid1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="Column1" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="5" />
            <ColumnDefinition Width="Auto" SharedSizeGroup="Column2" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="5" />
        </Grid.ColumnDefinitions>
        . . .
    </Grid>

    <Grid Name="InnerGrid2>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="Column1" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="5" />
            <ColumnDefinition Width="Auto" SharedSizeGroup="Column2" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="5" />
        </Grid.ColumnDefinitions>
        . . .
    </Grid>
</Grid>

In this example, there are two different columns in two different Grids that will always be the same size.

Upvotes: 1

Related Questions