Gridsplitter behavior when hiding a WPF grid column

I am new to WPF, so please excuse me if these days it is an “old hat” ... they broke through the web forum and did not find the answer I need:

I have a WPF grid with 5 columns - three for data, two for grid firmware, which (thanks to the information on this site!) Seem to work and resize. However - I need to show / hide the middle column. I can sort this, but when I hide the middle column, the gridsplitter's left hand still affects the “hidden” column - I need to switch between 2 and three columns efficiently. Here is my (prototype) code:

<Grid> <Grid.ColumnDefinitions> <ColumnDefinition Name="Col0" Width="*" /> <ColumnDefinition Name="Col1" Width="auto" /> <ColumnDefinition Name="Col2" Width="*" /> <ColumnDefinition Name="Col3" Width="auto" /> <ColumnDefinition Name="Col4" Width="auto" /> </Grid.ColumnDefinitions> <GridSplitter Grid.Column="1" Height="100" HorizontalAlignment="Center" Margin="0" Name="GridSplitter1" VerticalAlignment="Stretch" Width="3" /> <GridSplitter Grid.Column="3" Height="100" HorizontalAlignment="Center" Margin="0" Name="GridSplitter2" VerticalAlignment="Stretch" Width="3" /> <Border BorderBrush="Silver" BorderThickness="1" Grid.Column="0" HorizontalAlignment="Stretch" Margin="0" Name="Border1" VerticalAlignment="Stretch" Background="#FFC84797" /> <Border BorderBrush="Silver" BorderThickness="1" Grid.Column="2" HorizontalAlignment="Stretch" Margin="0" Name="Border2" VerticalAlignment="Stretch" Background="Black" /> <Border BorderBrush="Silver" BorderThickness="1" Grid.Column="4" HorizontalAlignment="Stretch" Margin="0" Name="Border3" VerticalAlignment="Stretch" Background="#FFA60000"> <Button Content="hide" Height="33" Name="butHide" Width="85" /> </Border> </Grid> 
  Private Sub butHide_Click (ByVal sender As Object, ByVal e As System.Windows.RoutedEventArgs) Handles butHide.Click

     If butHide.Content = "hide" Then

         butHide.Content = "show"
         Col2.Width = New GridLength (0)
         Border2.Visibility = System.Windows.Visibility.Collapsed
         GridSplitter2.Visibility = System.Windows.Visibility.Collapsed

     Else ()

         butHide.Content = "hide"
         Col2.Width = New GridLength (1, GridUnitType.Star)
         Border2.Visibility = System.Windows.Visibility.Visible
         GridSplitter2.Visibility = System.Windows.Visibility.Visible

     End if
 End sub

+4
source share
2 answers

It is probably easiest for you to set Grid.ZIndex="2" for Border1 , and then toggle ColumnSpan between 1 and 3 in the click event.

 <Border Grid.Column="0" Grid.ZIndex="2" Name="Border1" .../> 

Code for

 private void butHide_Click(object sender, RoutedEventArgs e) { if (butHide.Content.ToString() == "hide") { butHide.Content = "show"; Grid.SetColumnSpan(Border1, 3); } else { butHide.Content = "hide"; Grid.SetColumnSpan(Border1, 1); } } 
+5
source

Another solution puts the grid divider in the same column that you want to resize behind its contents, and set the field for the content. See Link for reference: http://www.ehow.com/how_4546867_use-gridsplitter-wpf.html

  <Grid> <Grid.RowDefinitions> <RowDefinition></RowDefinition> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> </Grid.ColumnDefinitions> <GridSplitter Grid.Row="0" Grid.Column="0" HorizontalAlignment="Right" Width="4" Background="Yellow"/> <TextBlock Grid.Row="0" Grid.Column="0" Margin="0 0 4 0" Background="LightGray">Text Block</TextBlock> <TextBlock Grid.Row="0" Grid.Column="1" Background="LightGreen">Text Block 2</TextBlock> </Grid> 

More: How to use gridsplitter in WPF | eaow.com http://www.ehow.com/how_4546867_use-gridsplitter-wpf.html#ixzz1mXqi6sGa

+2
source

All Articles