WPF binding SharedSizeGroup on Grid not working

Question

I am working on a WPF application to practice MVVM. I have a need to have 4 grids, all have only two columns - one for a "display" control (TextBlock/RadioButton with a field's name) and the other for "value" control (any control needed to represent the value of the field).

Each grid in another user control, and I need to have all of their first columns to be in sync, so the "value" controls will stretch over the screen while the "display" controls that share size will have automatic width that doesnt change.

If I set SharedSizeColumn with constant name, all the grids are in perfect and good looking sync, but I need to set the SharedSizeColumn via binding with my view model, because some user controls that contain those grids are shared between tabbed view models for reuse, and across tabs/view models I dont want the grids to be synchronized. When I set SharedSizeGroup with bindings, the 2 columns in all the grids act like there is no SharedSizeGroup set at all, I've even tried setting the binding via code using BindingOperations and still no luck.

Any idea how to successfully bind SharedSizeGroup, or another solution for preventing the SharedSizeGroup to be shared amongst tabs that reuse the same user control?

Rick Sladkey Rick Sladkey · Accepted Answer · 2011-06-25T01:58:00

Here is a complete working sample of using SharedSizeGroup with data binding.

The markup:

<Grid>
    <StackPanel Grid.IsSharedSizeScope="True" Margin="20">
        <Grid HorizontalAlignment="Left">
            <Grid.ColumnDefinitions>
                <ColumnDefinition SharedSizeGroup="{Binding ColumnA}"/>
                <ColumnDefinition SharedSizeGroup="{Binding ColumnB}"/>
            </Grid.ColumnDefinitions>
            <TextBlock Text="aa" Grid.Column="0" Foreground="Red"/>
            <TextBlock Text="bbbbbbbb" Grid.Column="1" Foreground="Blue"/>
        </Grid>
        <Grid HorizontalAlignment="Left">
            <Grid.ColumnDefinitions>
                <ColumnDefinition SharedSizeGroup="{Binding ColumnC}"/>
                <ColumnDefinition SharedSizeGroup="{Binding ColumnD}"/>
            </Grid.ColumnDefinitions>
            <TextBlock Text="cccccccc" Grid.Column="0" Foreground="Red"/>
            <TextBlock Text="dd" Grid.Column="1" Foreground="Blue"/>
        </Grid>
    </StackPanel>
</Grid>

and the code-behind:

void Window_Loaded(object sender, RoutedEventArgs e)
{
    DataContext = new SharedSizeGroupViewModel
    {
        ColumnA = "group1",
        ColumnB = "group2",
        ColumnC = "group1",
        ColumnD = "group2",
    };
}

and the primitive view-model:

public class SharedSizeGroupViewModel
{
    public string ColumnA { get; set; }
    public string ColumnB { get; set; }
    public string ColumnC { get; set; }
    public string ColumnD { get; set; }
}

and this is what it looks like:

SharedSizeGroup Demo

which shows the red and blue columns lined up.

WPF binding SharedSizeGroup on Grid not working

1 Answers