Home > Uncategorized > Procedural Animation in Silverlight 2

Procedural Animation in Silverlight 2

June 18, 2008

After some research, I’m recommending the use of Empty Storyboards for procedural animations.

What is an "Empty Storyboard"?  It is a Storyboard with no animations or specific target that simulates a game loop or per frame callback by having a short duration and once its Completed it Begins itself again.

A simple example looks like this in C#:

Storyboard timer = new Storyboard();
timer.Duration = TimeSpan.FromMilliseconds(500);
timer.Completed += new EventHandler(timer_Completed);

void timer_Completed(object sender, EventArgs e){
    if (conditionToKeepGoing)

The other two options include the DispatcherTimer, which is not suitable for this type of quick ticking, and Storyboards with defined Targets and Animations.

Modifying Animation values at run-time does work smoothly and as expected.  But you are limiting your flexibility by tying every Target property that’s animated to a matching Animation instance.  With an Empty Storyboard you are free to modify any property based on your calculations.

A combination of the two Storyboard method will most likely end up becoming the most powerful pattern.  During the game loop, within the empty Storyboard you can calculate your scene and when a different state is desired, you can call into an object’s prepared routines or Storyboards with linked Animations.

I’ve modified the original HelloBeta2 to use an Empty Storyboard and there is commented out code which adds a Storyboard to each Line as its drawn that moves its second point after initial placement.  This simulates the "known routine" idea, and I could easily update the new location for the second point at run-time.

I’ve also added a StrokeWidth loop and DashArray, but that was just for my own entertainment.

%d bloggers like this: