HTML and CSS Reference
In-Depth Information
By exporing the graphics using the CreateJS canvas toolkit, we can easily use it in our game
with a simple new call, which is shown as follows:
var animation = new lib.Explode();
When we take a deeper look at the generated code, we find that Adobe Flash has a variety
of exporing opions. If it is a classic tween animaion, Flash exports it to the TweenJS code.
If the program fails to transform the animaion into TweenJS, Flash generates the animaion
into a spritesheet and uses the
Sprite
and
MovieClip
imeline code in CreateJS.
Caching graphics inside the assets file
If the exported animaion makes use of TweenJS, we can cache the individual graphics inside
the animaion.
Note that we need to cache individual components because caching the enire animaion
will stop it from playing. Cached graphics are prerendered as bitmaps inside the EaselJS
library. This means that cached graphics act like a bitmap that cannot be changed or
animated. That's why we cannot cache the enire
Explode
sprite. It contains three
tween animaions on each smoke graphic. What we need to do is cache the individual
smoke graphics as bitmaps. It works because the cached bitmaps are added to the tween
animaion. The order is important. We cache the graphics and then animate them with
TweenJS, not the reverse of this order, which is shown as follows:
