Saturday, August 28, 2010

Silverlight dynamic point to point animation with EasingFunction

Download the source here:
Final output below:


My article is divided into two section:
Section 1: Will show you how to create a point to point animation with EasingFunction using Blend
Section 2: How to set the point value dynamically in code behind

Section 1:
I will ignore the project creation part.
I will use a simple Layout in MainPage.xaml




 Lets open the MainPage.xaml in Expression Blend and create a Storyboard








In the timeline select image add a KeyFrame to 0 sec




























Add the end keyFrame at 2 sec and move the image to some location (some location because the location will be controlled from the code behind)





























Now add back EasingFunction to the end keyFrame:





















Section -2:
Storyboard creation is completed. Now modify the generated XAML to control it from code behind:
 Modify the animation point with some random value from code behind:















Thats the end..

No comments:

Post a Comment