Question

<Grid x:Name="LayoutRoot" Background="White">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <ContentControl Grid.Row="1" Grid.Column="0" Content="{Binding Path=CurrentNavigationView}" Visibility="{Binding NavigationPageVisibility}" Margin="2"/>
    <GridSplitter Grid.Row="1" Grid.Column="1" Width="3" Margin="1,6,1,6"  Visibility="{Binding NavigationPageVisibility}" HorizontalAlignment="Center" Background="{StaticResource NetApp_LightGray_Brush}" />
    <ContentControl    Grid.Row="1" Grid.Column="2" Margin="2" Visibility="{Binding WelcomePageVisibility}" Content="{Binding Path=CurrentWelcomeView}" />
</Grid>

In the above xaml i am setting the visibility of the 1st content control and splitter based on some condition in my ViewModel. But when in case i resize the splitter while running, then there is some empty space being shown before the last content control. I need the content control to occupy the complete real estate when i set the 1st content control and splitter to collapsed?

Appreciate the help.

Answer 1

The problem is that the GridSplitter messes with the ColumnDefinitions, once you grab it the first column will no longer be Auto but a concrete pixel value. Here is an example which shows this:

<Grid Height="100">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Name="c0" Width="Auto"/>
        <ColumnDefinition Name="c1" Width="Auto"/>
        <ColumnDefinition Name="c2" Width="*"/>
    </Grid.ColumnDefinitions>
    <TextBlock Grid.Column="0" Text="{Binding Width, ElementName=c0}"/>
    <TextBlock Grid.Column="2" Text="{Binding Width, ElementName=c2}"/>
    <GridSplitter Grid.Column="1" Width="5" ResizeBehavior="PreviousAndNext"/>
</Grid>

So if you want it to be collapsible again you need to return the Width to Auto.