WPF - local animations (animations in code)
When trying to animate a WPF object in code (this is called a local animation) you sometimes need to be careful about which property you need to feed to which class. At the current (Februari) CTP timeframe the documentation isn't really clear on this but I am sure this will be fixed by the time WPF goes gold.
In my situation I had a rectangle inside a canvas whose location I wanted to animate. The caveat is that the location isn't a property of a rectangle itself but instead an attached property on the canvas containing the rectangle.
The proper way to do a local animation is to create a storyboard object and animate the properties by using the TypeAnimation objects like this:
Storyboard sb = new Storyboard();
Duration duration = new Duration(TimeSpan.FromSeconds(0.2));
DoubleAnimation da1 = new DoubleAnimation(x, duration);
DoubleAnimation da2 = new DoubleAnimation(y, duration);
The next step is to specifiy the target of your animation. This needs to be our rectangle, since that's the object that will be the target of our animation (even if the actual properties being animated are attached by the canvas!):
Storyboard.SetTargetName(da1, rectangle.Name);
Storyboard.SetTargetName(da2, rectangle.Name);
Do make sure that when creating the rectangle it has a valid name, this is required to do local animations.
The next step is where it gets tricky (well not really tricky, but it did require some experimenting). I said before that the left and top property are not really on the rectangle but rather attached through the canvas, so we need to tell the storyboard about this:
Storyboard.SetTargetProperty(da1, new PropertyPath(Canvas.LeftProperty));
Storyboard.SetTargetProperty(da2, new PropertyPath(Canvas.TopProperty));
The very last thing to do is to add the two doubleanimation objects to the storyboard and signal it to start.
sb.Children.Add(da1);
sb.Children.Add(da2);
sb.Begin(canvas);
I hope this made since.