Graphics Reference
In-Depth Information
All code in Edge Animate, whether written by hand or created using snippets,
is enclosed in a function declaration. We see the exact function comments in
the gray, shaded line directly above the numbered lines of code. Normally the
function signature is as follows:
function( sym, e )
This means that in your code, you have access to the
sym
variable. This variable
is basically a reference to the Stage or the actual Timeline of the parent symbol.
This is the reference you need when you want to control the Timeline through
code. Edge Animate has its own set of commands to control the Timeline and
deal with symbols, known as the Edge Animate API. This command is also pro-
vided with the
sym
variable. For example, you can call the Timeline commands
play()
or
stop()
directly on the variable as follows:
// stop the Timeline at the given position (ms or label)
sym.stop(0);
// play Timeline from the current
// position
sym.play();
If you have no experience in scripting, it is recommended that you take a
closer look at the code snippets. Not only does this simplify the work, it also
functions like a tutorial. The comments added in the process are very good de-
scriptions of each snippet.
4.5 Lessons
In the lessons section of this chapter, four small projects will teach you how
to use and combine different animation techniques with Edge Animate. The
sample projects cover:
Banner animation:
In this example, we create a simple banner for the header
of any page.
Asynchronous animation with playback actions:
In this example, we use the
playback actions for controlling different Timelines.
Car animation with script-driven Timeline:
In this example, we will create a
simple car animation that we will temporarily stop, using script, and then play
again after a short pause.
Sprite sheet animation: I
n this example, we will create a sprite sheet that we
will use in Edge Animate to create an animation sequence depicting a char-
acter running and jumping.
