WPF Splitter visibility

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.

Answer 2

Wild guess: you set the visibility to Visibility.Hidden

This only hides the control, but they retain their space.

If you set the visibility to Visibility.Collapsed it should solve your problem.

Answer 3

@Arihant,

1] Try GridSplitter.HorizontalAlignment as Stretch.

2] Is your GridSplitter.Background sensible enough to display the splitter?

3] Is Visibility="{Binding NavigationPageVisibility}" binding working? Do you see any binding errors on your Output window of your Visual Studio for this binding?

Is NavigationPageVisibility of type Visibility and of value Visibility.Visible?

Many developers declare such NavigationPageVisibility properties as boolean. That fails the binding.

4] Try to remove your Margin="1,6,1,6". It can sometimes take the splitter off the visible area.

5] You should not have Grid.Row="1". Splitter must always be at Row="0" and have a Grid.RowSpan maximum as possible. I set mine as 99.