LittleJS 1.28.0

Draw

SpriteAnimator

SpriteAnimator - A character's animations by name, like idle, walk and attack, and the one showing now

  • Each clip is a SpriteAnimation and keeps its own mode, loop, play or pingPong
  • set starts a clip over only when it changes or a play of it has ended, so it can be called every update
  • Read tileInfo each frame for the frame to draw, as with a SpriteAnimation

Constructor

new SpriteAnimator(clips)engineDraw.js:474

Create an animator from its clips, showing the first one

clips Object<string, SpriteAnimation>

The clips by name

const hero = new SpriteAnimator({
    idle:   new SpriteAnimation(tile(0, 16), 2, .4),
    walk:   new SpriteAnimation(tile(2, 16), 4, .1),
    attack: new SpriteAnimation(tile(6, 16), 3, .05).play(),
});
hero.set('attack', ()=> hero.set('idle')); // back to idle when the attack ends
// in update: this.tileInfo = hero.tileInfo;

Members

Methods

Members

The clip showing now

clips : Object<string, SpriteAnimation>engineDraw.js:483

The clips by name

frame : numberengineDraw.js:525

The frame of the clip showing now

isDone : booleanengineDraw.js:529

True once the clip showing now is a play that has ended

name : stringengineDraw.js:485

The name of the clip showing now

The tile of the frame showing now

Methods

set(name, onEnd) → SpriteAnimatorengineDraw.js:492

Show a clip, starting it over in its own mode unless it is showing and has not ended

name string

The clip's name

onEnd function optional

Called once when a play clip ends, as with SpriteAnimation.play