title: Storyboard does not change when I change style in WPF
body: <p>I want to run a simple animation on an arrow picture (png). The arrow points either downwards or upwards, and the animation is supposed to be a wave going through the arrow in the direction it points at.</p>
  
  <p>I use the Image control and assign one of two styles to it. These styles define the picture to use and three double animations in a storyboard. The animation is supposed to run unconditionally, just from the moment the Image is created, forever. One of the styles is an arrow pointing upwards with a wave moving upwards (<em>Trend_Rising</em>), and the other style is an arrow pointing downwards with wave going downwards (<em>Trend_Falling</em>).</p>
  
  <p>The following is the Image, and the style is in a separate file referenced from the UserControl where the Image is embedded.</p>
  
  <pre><code>&lt;Image x:Name="TrendImg" Style="{DynamicResource Trend_Falling}" /&gt;
  </code></pre>
  
  <p>This is the content of the styles file:</p>
  
  <pre><code>&lt;ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"&gt;
  
       &lt;Style x:Key="Trend_Base" TargetType="Image"&gt;
  
          &lt;Setter Property="OpacityMask"&gt;
              &lt;Setter.Value&gt;
                  &lt;LinearGradientBrush StartPoint="0,1" EndPoint="0,0"&gt;
                      &lt;GradientStop Color="Black" /&gt;
                      &lt;GradientStop Color="Transparent" /&gt;
                      &lt;GradientStop Color="Black" /&gt;
                  &lt;/LinearGradientBrush&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
  
      &lt;/Style&gt;
  
      &lt;Style x:Key="Trend_Rising_Base" TargetType="Image" BasedOn="{StaticResource Trend_Base}"&gt;
  
          &lt;Style.Triggers&gt;
              &lt;Trigger Property="IsVisible" Value="True"&gt;
                  &lt;Trigger.EnterActions&gt;
                      &lt;BeginStoryboard&gt;
                          &lt;Storyboard&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[0].Offset" From="-0.1" To="0.9" Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[1].Offset" From="0.0"  To="1.0" Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[2].Offset" From="0.1"  To="1.1" Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                          &lt;/Storyboard&gt;
                      &lt;/BeginStoryboard&gt;
                  &lt;/Trigger.EnterActions&gt;
              &lt;/Trigger&gt;
          &lt;/Style.Triggers&gt;
  
      &lt;/Style&gt;
  
      &lt;Style x:Key="Trend_Falling_Base" TargetType="Image" BasedOn="{StaticResource Trend_Base}"&gt;
  
          &lt;Style.Triggers&gt;
              &lt;Trigger Property="IsVisible" Value="True"&gt;
                  &lt;Trigger.EnterActions&gt;
                      &lt;BeginStoryboard&gt;
                          &lt;Storyboard&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[0].Offset" From="0.9" To="-0.1" Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[1].Offset" From="1.0" To="0.0"  Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[2].Offset" From="1.1" To="0.1"  Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                          &lt;/Storyboard&gt;
                      &lt;/BeginStoryboard&gt;
                  &lt;/Trigger.EnterActions&gt;
              &lt;/Trigger&gt;
          &lt;/Style.Triggers&gt;
  
      &lt;/Style&gt;
  
      &lt;Style x:Key="Trend_Rising" TargetType="Image" BasedOn="{StaticResource Trend_Rising_Base}"&gt;
          &lt;Setter Property="Height" Value="16" /&gt;
          &lt;Setter Property="Source" Value="trend_rising.png" /&gt;
      &lt;/Style&gt;
  
      &lt;Style x:Key="Trend_Falling" TargetType="Image" BasedOn="{StaticResource Trend_Falling_Base}"&gt;
          &lt;Setter Property="Height" Value="16" /&gt;
          &lt;Setter Property="Source" Value="trend_falling.png" /&gt;
      &lt;/Style&gt;
  
  &lt;/ResourceDictionary&gt;
  </code></pre>
  
  <p>The thing is that when I change the style programmatically, the animation does not change. For instance, if I start the application (the Image has the <em>Trend_Falling</em> style assigned), the downward arrow will be displayed with wave animation moving downwards as it should. But when I change the style to <em>Trend_Rising</em> at runtime, the arrow picture changes as it should, but the animation remains the same.</p>
  
  <pre><code>TrendImg.SetResourceReference(Control.StyleProperty, "Trend_Rising")
  </code></pre>
  
  <p>What am I doing wrong? I will be grateful for any help. Thank you!</p>
  
  <p><strong>-- EDIT --</strong></p>
  
  <p>I created an <em>ImageWithAnim</em> class which is a descendant of <em>Image</em>, and added a boolean <em>Animate</em> dependency property to it. Then I attached the trigger to that property instead of <em>IsVisible</em>. True starts the storyboard and false is supposed to stop it, but it does not... When I set <em>Animate</em> to false, an exception is thrown saying that the name <em>RisingStoryboard</em> can not be resolved in the namespace <em>System.Windows.Style</em>. I found several posts on StackOverflow according to which this example should work (among those that claimed it won't :-) ).</p>
  
  <p>So... now I have no idea how to do it right. I will be grateful for any help. Thank you!</p>
  
  <p>This is the changed xaml:</p>
  
  <pre><code>&lt;ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:Test="clr-namespace:StyleChangeTest"&gt;
  
      &lt;Style x:Key="Trend_Base" TargetType="Test:ImageWithAnim"&gt;
  
          &lt;Setter Property="OpacityMask"&gt;
              &lt;Setter.Value&gt;
                  &lt;LinearGradientBrush StartPoint="0,1" EndPoint="0,0"&gt;
                      &lt;GradientStop Color="Black" /&gt;
                      &lt;GradientStop Color="Transparent" /&gt;
                      &lt;GradientStop Color="Black" /&gt;
                  &lt;/LinearGradientBrush&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
  
      &lt;/Style&gt;
  
      &lt;Style x:Key="Trend_Rising_Base" TargetType="Test:ImageWithAnim" BasedOn="{StaticResource Trend_Base}"&gt;
  
          &lt;Style.Triggers&gt;
              &lt;Trigger Property="Animate" Value="True"&gt;
                  &lt;Trigger.EnterActions&gt;
                      &lt;BeginStoryboard x:Name="RisingStoryboard"&gt;
                          &lt;Storyboard&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[0].Offset" From="-0.1" To="0.9" Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[1].Offset" From="0.0"  To="1.0" Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[2].Offset" From="0.1"  To="1.1" Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                          &lt;/Storyboard&gt;
                      &lt;/BeginStoryboard&gt;
                  &lt;/Trigger.EnterActions&gt;
              &lt;/Trigger&gt;
  
              &lt;Trigger Property="Animate" Value="False"&gt;
                  &lt;Trigger.EnterActions&gt;
                      &lt;StopStoryboard BeginStoryboardName="RisingStoryboard" /&gt;
                  &lt;/Trigger.EnterActions&gt;
              &lt;/Trigger&gt;
          &lt;/Style.Triggers&gt;
  
      &lt;/Style&gt;
  
      &lt;Style x:Key="Trend_Falling_Base" TargetType="Test:ImageWithAnim" BasedOn="{StaticResource Trend_Base}"&gt;
  
          &lt;Style.Triggers&gt;
              &lt;Trigger Property="Animate" Value="True"&gt;
                  &lt;Trigger.EnterActions&gt;
                      &lt;BeginStoryboard x:Name="FallingStoryboard"&gt;
                          &lt;Storyboard&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[0].Offset" From="0.9" To="-0.1" Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[1].Offset" From="1.0" To="0.0"  Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                              &lt;DoubleAnimation Storyboard.TargetProperty="OpacityMask.GradientStops[2].Offset" From="1.1" To="0.1"  Duration="0:0:2" RepeatBehavior="Forever" /&gt;
                          &lt;/Storyboard&gt;
                      &lt;/BeginStoryboard&gt;
                  &lt;/Trigger.EnterActions&gt;
              &lt;/Trigger&gt;
  
              &lt;Trigger Property="Animate" Value="False"&gt;
                  &lt;Trigger.EnterActions&gt;
                      &lt;StopStoryboard BeginStoryboardName="FallingStoryboard" /&gt;
                  &lt;/Trigger.EnterActions&gt;
              &lt;/Trigger&gt;                
          &lt;/Style.Triggers&gt;
  
      &lt;/Style&gt;
  
      &lt;Style x:Key="Trend_Rising" TargetType="Test:ImageWithAnim" BasedOn="{StaticResource Trend_Rising_Base}"&gt;
          &lt;Setter Property="Height" Value="16" /&gt;
          &lt;Setter Property="Source" Value="trend_rising.png" /&gt;
      &lt;/Style&gt;
  
      &lt;Style x:Key="Trend_Falling" TargetType="Test:ImageWithAnim" BasedOn="{StaticResource Trend_Falling_Base}"&gt;
          &lt;Setter Property="Height" Value="16" /&gt;
          &lt;Setter Property="Source" Value="trend_falling.png" /&gt;
      &lt;/Style&gt;
  
  &lt;/ResourceDictionary&gt;
  </code></pre>
  
  <p>And here's the <em>ImageWithAnim</em> class:</p>
  
  <pre><code>Public Class ImageWithAnim
      Inherits Image
  
      Private Shared _animate As DependencyProperty = DependencyProperty.Register("Animate",
                                                                                  GetType(Boolean),
                                                                                  GetType(ImageWithAnim),
                                                                                  New PropertyMetadata(defaultValue:=False))
  
      Public Shared ReadOnly Property AnimateProperty As DependencyProperty
          Get
              Return _animate
          End Get
      End Property
  
      Public Property Animate() As Boolean
          Get
              Return CBool(GetValue(_animate))
          End Get
          Set(value As Boolean)
              SetValue(_animate, value)
          End Set
      End Property
  
  End Class
  </code></pre>