Sharing Column Widths Between Multiple WPF Controls

Question

Is there any way of sharing column widths between controls, not just between multiple grids on the same control?

Crude diagram of what I'm trying to get at:

I'm currently messing around with getting the widths of the labels in the first column of each UserControl, but it seems a messy solution that is quite CPU heavy (finding the labels and calculating the widths of the text before it's rendered is nasty!).

I've been reading up on as much about SharedSizeGroups as I can find, but there's nothing suggesting they work across different controls. Is there a simple solution or even a less simple one that isn't utterly hideous?!

Answer 1

Both previous answers are correct. Here's an example (taken mostly from MSDN) on how you can use this on two different UserControls by setting Grid.IsSharedSizeScope="True" on the parent container. Notice the SharedSizeGroup attribute on the ColumnDefinition. You can see the effect by toggling Grid.IsSharedSizeScope True/False

MainWindow

<StackPanel Grid.IsSharedSizeScope="True">
    <my:UserControl1 HorizontalAlignment="Left" x:Name="userControl11" />
    <my:UserControl2 HorizontalAlignment="Left" x:Name="userControl21" />
</StackPanel>

UserControl1

<UserControl ...>
    <Grid ShowGridLines="True" Margin="0,0,10,0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition SharedSizeGroup="FirstColumn"/>
            <ColumnDefinition SharedSizeGroup="SecondColumn"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" SharedSizeGroup="FirstRow"/>
        </Grid.RowDefinitions>

        <Rectangle Fill="Silver" Grid.Column="0" Grid.Row="0" Width="200" Height="100"/>
        <Rectangle Fill="Blue" Grid.Column="1" Grid.Row="0" Width="150" Height="100"/>

        <TextBlock Grid.Column="0" Grid.Row="0" FontWeight="Bold">First Column</TextBlock>
        <TextBlock Grid.Column="1" Grid.Row="0" FontWeight="Bold">Second Column</TextBlock>
    </Grid>

</UserControl>

UserControl2

<UserControl ...>
    <Grid ShowGridLines="True" Margin="0,0,10,0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition SharedSizeGroup="FirstColumn"/>
            <ColumnDefinition SharedSizeGroup="SecondColumn"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" SharedSizeGroup="FirstRow"/>
        </Grid.RowDefinitions>

        <Rectangle Fill="Silver" Grid.Column="0" Grid.Row="0" />
        <Rectangle Fill="Blue" Grid.Column="1" Grid.Row="0" />

        <TextBlock Grid.Column="0" Grid.Row="0" FontWeight="Bold">First Column</TextBlock>
        <TextBlock Grid.Column="1" Grid.Row="0" FontWeight="Bold">Second Column</TextBlock>
    </Grid>
</UserControl>