Monday, 4 March 2013

EaselJS: Animation 1

A simple animation of a circle looping across the stage.

1) I have declared 'circle' outside of the init function so that other functions can access it.
2) Likewise with 'circleRadius' - I will need to use it in the looping code.
5) Ticker is a class that exists (you don't need to create it, it exists to handle framerate etc), and to use it, you add an event listener to it.
4) You have to say "tick" as the type of event it will listen for.
3) The name of the function that will be called at every 'tick'.
6) Allows you to determine the frame rate, an alternative method is commented out below.
8) Gives you the width of your canvas, so you can check if the circle has moved across it.
7) Adding the circleRadius makes sure the circle is completely off-stage before it goes back to the beginning.
9) This positions the circle just off stage, before it moves on.
10) Call the update in the ticking function so that you can see the change with every tick.

No comments:

Post a Comment

Please enter your message here...