Animation.md

Animation

Creating an animated sprite in H2D is relative easy.

Instead of using h2d.Bitmap to display a single Tile, you can use h2d.Anim to display a list of tiles that will automatically be played:

// creates three tiles with different color
var t1 = h2d.Tile.fromColor(0xFF0000, 30, 30);
var t2 = h2d.Tile.fromColor(0x00FF00, 30, 40);
var t3 = h2d.Tile.fromColor(0x0000FF, 30, 50);

// creates an animation for these tiles
var anim = new h2d.Anim([t1,t2,t3],s2d);

Working with spritesheets

One way to create an animation is by using an external spritesheet. One way to do this is by first using the hxd.Res class to load sprite sheet, convert it to a tile using the toTile() method, and then convert that into tile array with gridFlatten(). You can then pass the tile array to a new instance of the h2d.Anim class.

// creates a tile array by dividing the sprite sheet into a grid
var tileArray = hxd.Res.knight.noBKG_KnightIdle_strip.toTile().gridFlatten(64);

// creates an animation from the tile array
var player = new h2d.Anim(tileArray, s2d);

You can learn more about Heaps resource management and using hxd.Res in the Resource Management section of the documentation.

Properties and methods

The following properties and methods can be accessed on h2d.Anim:

• speed : changes the playback speed of the animation, in frames per seconds.
• loop : tells if the animation will loop after it reaches the last frame.
• onAnimEnd : this dynamic method can be set to be informed when we have reached the end of the animation :

anim.onAnimEnd = function() {
	trace("animation ended!");
}

Anim instances have other properties which can be discovered by reviewing the h2d.Anim class.