In the last tutorial, we covered using
Storyboards to create preset animations which are very similar to timelines
in Flash. Another animation method commonly used in Flash is animating objects with
code during the ENTER_FRAME event.
The equivalent event in Silverlight is called CompositionTarget.Rendering. In this
tutorial we’ll demonstrate how to use the event.
Here’s an example using procedural animation in Flash:
To create this example in Flash, you could use the steps below:
Create a new Flash File (ActionScript 3.0) with an actions layer and single frame.
Set the Size to 600 x 200 and the Background color to #333333.
Draw a circle and convert it to a Movie Clip named “ball”
Using the Project panel, create a new class named “Ball” and bind it to the “ball”
Import the Event class:
Add the following properties to the Ball class:
var vx:Number; var vy:Number; var count:Number = 0;
Now let’s take a look at how you would create this example in Silverlight.
Set the Stage and Create a Ball Control
We’re staying strong with our initial setup pattern. This tutorial setup is the
same as the last one, so we’ll quickly breeze through the first few actions. This
time I chose to use a tiny 4px wide green circle.
If you have questions on how to accomplish one of the tasks below, please refer
back to The Beginning
tutorial in this series.
Create a new Silverlight Application + Website
Set Width and Height of [UserControl] to 600 and 200
Set the Background of LayoutRoot in MainPage to #333333
Change the LayoutRoot Grid to a Canvas
Add a new UserControl and name it “ball”
Add a small Ellipse centered on the upper left corner in the ball UserControl