title: Make a groupbox appear and disappear with fade in fade out animation
body: <p>in the following example, I don't understand how I could make my "Live Updates" groupbox appear/disappear when the upper checkbox is checked/unchecked. I am looking for a fast fade in/fade out effect in XAML but I am a little lost..</p>
  
  <p><img src="https://i.stack.imgur.com/95saH.png" alt="enter image description here"></p>
  
  <pre><code>&lt;UserControl
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      mc:Ignorable="d"
      x:Class="WpfControlLibrary1.MainControl"
      x:Name="MultiVol" MinHeight="520.12" MinWidth="213"&gt;
  
      &lt;Grid HorizontalAlignment="Stretch"&gt;
          &lt;Grid.Background&gt;
                  &lt;LinearGradientBrush EndPoint="0.5,1" MappingMode="RelativeToBoundingBox" StartPoint="0.5,0"&gt;
                      &lt;GradientStop Color="White" Offset="0.966"/&gt;
                      &lt;GradientStop Color="#FFD7D4FF"/&gt;
                  &lt;/LinearGradientBrush&gt;
          &lt;/Grid.Background&gt;
  
          &lt;Grid.RowDefinitions&gt;
              &lt;RowDefinition Height="Auto" /&gt;
              &lt;RowDefinition Height="*"/&gt;
          &lt;/Grid.RowDefinitions&gt;
          &lt;Grid.ColumnDefinitions&gt;
              &lt;ColumnDefinition /&gt;
          &lt;/Grid.ColumnDefinitions&gt;
  
          &lt;StackPanel x:Name="LayoutRoot" HorizontalAlignment="Stretch"  Grid.Row="0"&gt;
  
              &lt;GroupBox Margin="8,0" BorderBrush="#FF88B1D8" HorizontalAlignment="Stretch" Height="99"&gt;
                  &lt;GroupBox.Header&gt;
                      &lt;WrapPanel&gt;
                      &lt;Label Content="General" Background="#00000000" Foreground="#FF0033FF" FontWeight="Bold" FontFamily="/WpfControlLibrary1;component/Fonts/#Tahoma" /&gt;    
                      &lt;/WrapPanel&gt;
                  &lt;/GroupBox.Header&gt;
  
                  &lt;UniformGrid Columns="2"&gt;
                      &lt;Label Content="RICs" /&gt;
                      &lt;TextBox AcceptsReturn="False" AcceptsTab="True" AllowDrop="True" IsTabStop="True" /&gt;
                      &lt;Label Content="Preference" /&gt;
                      &lt;UniformGrid VerticalAlignment="Center" Columns="2" Rows="1"&gt;
                          &lt;RadioButton GroupName="preference" Content="Exotic" IsChecked="False" /&gt;
                          &lt;RadioButton GroupName="preference" Content="Flow" IsChecked="True" /&gt;
                      &lt;/UniformGrid&gt;
                      &lt;Label Content="Live updates" /&gt;
                      &lt;CheckBox IsChecked="True" VerticalAlignment="Center"/&gt;
                  &lt;/UniformGrid&gt;  
              &lt;/GroupBox&gt;
          &lt;/StackPanel&gt;
  
          &lt;DockPanel Grid.Row="1" HorizontalAlignment="Stretch"&gt;
              &lt;GroupBox Margin="8,0" BorderBrush="#FF88B1D8" HorizontalAlignment="Stretch"&gt;
                  &lt;GroupBox.Header&gt;
                      &lt;WrapPanel&gt;
                      &lt;Label Content="Live updates" Background="#00000000" Foreground="#FF0033FF" FontWeight="Bold" FontFamily="/WpfControlLibrary1;component/Fonts/#Tahoma" /&gt;   
                      &lt;/WrapPanel&gt;
                  &lt;/GroupBox.Header&gt;
                      &lt;ListView MinHeight="100" Background="{x:Null}"&gt;
                          &lt;ListView.View&gt;
                              &lt;GridView AllowsColumnReorder="False"&gt;
                                  &lt;GridViewColumn Header="RIC" /&gt;
                                  &lt;GridViewColumn Header="Last tick" /&gt;
                             &lt;/GridView&gt;
                          &lt;/ListView.View&gt;
                      &lt;/ListView&gt;
              &lt;/GroupBox&gt;         
          &lt;/DockPanel&gt;
  
          &lt;/Grid&gt;
  &lt;/UserControl&gt;
  </code></pre>
  
  <p>UPDATE : I get the fade in now, and I tried to add the fade out by adding a Trigger tag :</p>
  
  <pre><code>           &lt;DockPanel.Style&gt;
                  &lt;Style TargetType="{x:Type DockPanel}"&gt;
                      &lt;Style.Triggers&gt;
                          &lt;Trigger Property="Visibility" Value="Visible"&gt;
                              &lt;Trigger.EnterActions&gt;
                                  &lt;BeginStoryboard&gt;
                                      &lt;Storyboard&gt;
                                          &lt;DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="00:00:0.5" From="0.0" To="1.0" /&gt;
                                      &lt;/Storyboard&gt;
                                  &lt;/BeginStoryboard&gt;
                              &lt;/Trigger.EnterActions&gt;
                          &lt;/Trigger&gt;
                          &lt;Trigger Property="Visibility" Value="Hidden"&gt;
                              &lt;Trigger.EnterActions&gt;
                                  &lt;BeginStoryboard&gt;
                                      &lt;Storyboard&gt;
                                          &lt;DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="00:00:0.5" From="1.0" To="0.0" /&gt;
                                      &lt;/Storyboard&gt;
                                  &lt;/BeginStoryboard&gt;
                              &lt;/Trigger.EnterActions&gt;
                          &lt;/Trigger&gt;
                      &lt;/Style.Triggers&gt;
                  &lt;/Style&gt;
              &lt;/DockPanel.Style&gt;
  </code></pre>