Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Dynamically toggle visibility of WPF grid column from C# code

My problem is: I can't find out how to toggle the visibility of my WPF grid column. Assume following XAML markup:

<Grid x:Name="myGrid">     <Grid.RowDefinitions>         <RowDefinition x:Name="Row1" />         <RowDefinition x:Name="Row2" />     </Grid.RowDefinitions>     <Grid.ColumnDefinitions>         <ColumnDefinition x:Name="Column1" />         <ColumnDefinition x:Name="Column2" />     </Grid.ColumnDefinitions> </Grid> 

Aferwards the grid is filled with some controls etc. Now I want to hide a single column dynamically out of my C# code. I've tried achieving this by setting the the column's definition width to zero, e.g. Column1.Width = 0. This works, but I don't really like this solution - is there really no better way?

I'm looking for something like myGrid.Columns[0].Visibility = COLLAPSED or Column1.Visibility = HIDDEN. I just can't find something like that - any ideas?

like image 986
sebi Avatar asked Oct 07 '13 14:10

sebi


2 Answers

<ColumnDefinition>   <ColumnDefinition.Style>     <Style TargetType="ColumnDefinition">       <Setter Property="Width" Value="*" />         <Style.Triggers>           <DataTrigger Binding="{Binding IsColumnVisible}" Value="False">             <Setter Property="Width" Value="0" />           </DataTrigger>         </Style.Triggers>     </Style>   </ColumnDefinition.Style> </ColumnDefinition> 

Please do implement INotifyPropertyChanged in your ViewModel

like image 173
Morlo Mbakop Avatar answered Oct 04 '22 18:10

Morlo Mbakop


The simplest way to do this is to add a named Grid as the top level control in the relevant column that you want to hide. Then you can just hide it and all of its contents as you would any other control:

In XAML:

<Grid x:Name="myGrid">     <Grid.RowDefinitions>         <RowDefinition x:Name="Row1" />         <RowDefinition x:Name="Row2" />     </Grid.RowDefinitions>     <Grid.ColumnDefinitions>         <ColumnDefinition x:Name="Column1" />         <ColumnDefinition x:Name="Column2" />     </Grid.ColumnDefinitions>     <Grid x:Name="GridColumn1" Grid.Column="1">         ...     </Grid> </Grid> 

Then in code behind:

GridColumn1.Visibility = Visibility.Collapsed; 

As you have more than one row in your Grid, you may want to rearrange them like this:

<Grid x:Name="myGrid">     <Grid.ColumnDefinitions>         <ColumnDefinition x:Name="Column1" />         <ColumnDefinition x:Name="Column2" />     </Grid.ColumnDefinitions>     <Grid x:Name="GridColumn0" Grid.Column="0">         <Grid.RowDefinitions>             <RowDefinition />             <RowDefinition />         </Grid.RowDefinitions>     </Grid>     <Grid x:Name="GridColumn1" Grid.Column="1">         <Grid.RowDefinitions>             <RowDefinition />             <RowDefinition />         </Grid.RowDefinitions>     </Grid> </Grid> 

UPDATE >>>

It is not really necessary to rearrange the main Grid like this... you could just as easily add two Grid controls, one in each row of the relevant column and then set the Visibility of them both together:

InnerGrid1.Visibility = InnerGrid2.Visibility = Visibility.Collapsed; 

You could even add a Grid into each cell of the main Grid and have full control over which cells are visible at any one time.

like image 34
Sheridan Avatar answered Oct 04 '22 17:10

Sheridan