title: WPF Animation Based on Grid Visibility
body: <p>I have a grid that starts collapsed. When the user clicks the button, the code behind sets visibility to to visible. Then the buttons XAML trigger makes the grid grow from 0 to 1925 over 3 seconds.</p>
  
  <p>I was trying to figure out how in XAML to program the trigger to look for the visibility of the grid. Then depending on its state make the animation grow or shrink. So based on the code below I would like to make the grid go from 1925 to 0 if the trigger determines the visibility is visible and 0 to 1925 if the grid is showing collapsed upon button click. Want to stay away from the code knowing whats going on in the UI. Which is why later I will bind grid visibility to a property.</p>
  
  <p>Main Components of the XAML</p>
  
  <pre><code>    &lt;Grid Name="gridDisplay" Background="AliceBlue" Visibility="Collapsed"&gt;
  
      &lt;/Grid&gt;
  
  
  
      &lt;Button 
          Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}"
          Width="32" Height="32" FontSize="16" VerticalAlignment="Center" HorizontalAlignment="Right" Background="White" Click="Button_Click"&gt;
          &amp;gt;
  
          &lt;Button.Triggers&gt;
              &lt;EventTrigger RoutedEvent="Button.Click"&gt;
                  &lt;BeginStoryboard&gt;
                      &lt;Storyboard&gt;
                          &lt;DoubleAnimation 
                              Storyboard.TargetName="gridDisplay"
                              Storyboard.TargetProperty="Width"
                              From="0" To="1925" Duration="0:0:3" /&gt;
                      &lt;/Storyboard&gt;
                  &lt;/BeginStoryboard&gt;
              &lt;/EventTrigger&gt;
          &lt;/Button.Triggers&gt;
      &lt;/Button&gt;
  </code></pre>
  
  <p>Button Event</p>
  
  <pre><code>        //TODO: Bind grid to visibility property
          if (gridDisplay.Visibility == System.Windows.Visibility.Collapsed)
          {
              gridDisplay.Visibility = System.Windows.Visibility.Visible;
              (sender as Button).Content = "&lt;";
          }
          else
          {
              gridDisplay.Visibility = System.Windows.Visibility.Collapsed;
              (sender as Button).Content = "&gt;";
          }
  </code></pre>