title: Animating WPF element in XAML using attached property?
body: <p>I got my animation to work triggered by a property in my ViewModel. If I set my <code>TargetProperty</code> to <code>Width</code>, the below code actually works in growing the image. </p>
  
  <p>Next, I wanted to actually move the image up and down. To do this, I added a <code>Canvas</code> component around my image, to be able to animate based on <code>Canvas.Top</code> property. Setting <code>Canvas.Top</code> on the image moves it where I want.</p>
  
  <p>However, if I set my <code>StoryBoard.TargetProperty</code> to <code>Canvas.Top</code>, I get an error:</p>
  
  <blockquote>
    <p>Cannot resolve all property references in the property path
    Canvas.Top.</p>
  </blockquote>
  
  <pre><code>&lt;Style x:Key="LoadingImageAnimation" TargetType="{x:Type Image}"&gt;
    &lt;Style.Triggers&gt;
      &lt;DataTrigger Binding="{Binding IsLoading}" Value="True"&gt;
        &lt;DataTrigger.EnterActions&gt;
          &lt;BeginStoryboard&gt;
            &lt;Storyboard&gt;
              &lt;DoubleAnimation From="10" To="250" AutoReverse="True" Duration="0:0:30"
                               Storyboard.TargetProperty="Canvas.Top"/&gt;
            &lt;/Storyboard&gt;
          &lt;/BeginStoryboard&gt;
        &lt;/DataTrigger.EnterActions&gt;
      &lt;/DataTrigger&gt;
    &lt;/Style.Triggers&gt;
  &lt;/Style&gt;
  </code></pre>
  
  <p>Is my approach totally off, or just a matter of finding the Attached Property? </p>