<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.
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
.