Shared Sizes between WPF Grid Columns/Rows

via WPF Grid Shared Size Groups – Guy

Normal Grid:


Column 2 width set by column 1 width of the same grid:


Column 2 width at grid 2 is set by column 1 width of grid 1:


You may reuse the shared size group in multiple columns or rows at multiple grids.

Please pay attention to the fact that the share size group is set both ways, that means that the size of all shared column (or rows) is set by the largest column (or row).

Sharing a group can be done by simply setting the ColumnDefinition‘s SharedSizeGroupproperty to a specific name that will be also used at the other’s column’s definition.

<Grid Grid.Row=”0″Background=”AliceBlue”  ShowGridLines=”True”>
<Grid.ColumnDefinitions>
<ColumnDefinition Width=”Auto”SharedSizeGroup=”ShareThis“></ColumnDefinition>
<ColumnDefinition Width=”Auto”></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>

….

<Grid Grid.Row=”2″ Background=”AntiqueWhite”  ShowGridLines=”True”>
<Grid.ColumnDefinitions>
<ColumnDefinition Width=”Auto” SharedSizeGroup=”ShareThis“></ColumnDefinition>
<ColumnDefinition Width=”Auto” ></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>

One last thing to do is to set the scope of the shared size group in the current window, this can be done by setting Grid.IsSharedSizeScope property to true at a container whose scope encompasses the shared columns/rows.

<Grid Grid.IsSharedSizeScope=”True” >

You can view a sample code here

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: