Dynamically toggle visibility of WPF grid column from C# code Dynamically toggle visibility of WPF grid column from C# code wpf wpf

Dynamically toggle visibility of WPF grid column from C# code


<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


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.


In WPF Grid Column and Row Hiding on Code Project, they show a way using dependency properties. They set Visible = false, but internally, it sets Width = 0.

Another idea is to delete the column definition in code behind... But I guess it's an even worse hack! :(