What are the advantages over using a generic MovieClip? When writing games you might have several animated graphics (also called sprites, but not related to the AS3 Sprite class) that should run with a different framerate than the game’s global framerate. Let’s say your game runs with a global framerate of 99 and you put several animated sprites into your game that were created for playing back with a framerate of 24. With a MovieClip all those sprites would also play with a framerate of 99 which means they play way too fast. However with an AnimatedBitmap you can set every framerate individually. There are a couple of other advantages like that a Bitmap is more lightweight than a MovieClip and it has a isPlaying() method. Also it changes the way of how to embed assets. Instead of embedding many files for one animation only one image for a whole animation sequence is embedded which has positive effects on the file size. The ring sequence used in the demo has 21 frames that use 102Kb as single images but only 44Kb when they are combined to one image.

The following demonstration plays with a global framerate of 99 but all AnimatedBitmap instances play at a framerate of 24 …

(Please open the article to see the Flash content.)

You can download the class including demo source code and demo image here:

Update: The class is now part of the hexagonLib and can be found here. You want this version because it’s the one that is being maintained.

Changes in v1.1
The timer object used to time the frame animation has now been made external. For this purpose a custom FrameRateTimer class has been added. This has the advantage that AnimatedBitmap objects don’t use their own timer objects anymore. Instead you can use one timer for many animated objects if they use the same framerate. This saves memory and CPU cycles. However you are still able to use one FrameRateTimer for every animated object if it is desired.
An IAnimatedDisplayObject interface has been added so that future animated display object types can be integrated more easily.

Also included is a jsx script for Photoshop CS named HDRS- CreateImageSequence that can be used to easily create a ‘single-frames image’ with Photoshop. Simply run the script in Photoshop and choose the images in the file browser that appears. Photoshop will then generate a single image with all the frames laid out horizontally. All images should have the same size to get a correct animation sequence. Also sometimes you need to fine-tune the position of some frames, e.g. for the ring in the demo (which was rendered to single frame images from a 3D modeler) I had to adjust the horizontal alignment on some frames because otherwise the animation would glitch to left/right by some pixels.

Currently there are AlphaFade, BlurEffect, ColorFade, ModuloEffect, MoveEffect, Pixelizer and TimeDelay who act as effects. The EffectCombiner can be used to combine several of the effects into one (which means that all combined effects use the same Timer) and the EffectChainer can be used to play back effects in sequencial order (including the EffectChainer which acts as an effect on itself). The TimeDelay is a non-visual effect which simply applies a time delay.

The class from where the effects are started has to implement the INotify interface which only contains one method, notify(). The effects (as well as the EffectChainer and EffectCombiner) use this interface to notify the caller and – if necessary – give back a callID that can be used to determine which effect has returned. More detailed info on this will be available in the API docs when the framework is released … soon™.

(Please open the article to see the Flash content.)

You can focus the SWF with the Mouse and press Space to skip through the effects.