Skip to main content

SpriteSheet

SpriteSheet is a class that extends the Sprite class. It allows the management of sprite sheet animations.

info

This class extends from Sprite.

All getters, setters and methods from Sprite are available here!


Constructor​

prototype
constructor(imageName: string, frameSize: Point);

Properties​

  • imageName

    • Type: string
    • The name of the image to use.

  • frameSize

    • Type: Point
    • The size of a single frame.

Example​

const spriteSheet = new SpriteSheet('myImage', new Point(32, 32));

Getters​

currentAnimation​

  • Type: SpriteSheetAnimation

The current animation.

currentAnimationName​

  • Type: string

The name of the current animation.

currentAnimationFrame​

  • Type: number

The current frame of the current animation.

isAnimationEnded​

  • Type: boolean

Whether the animation has ended.


Methods​

addAnimation​

prototype
addAnimation(name: string, animation: SpriteSheetAnimation): SpriteSheet;

Adds an animation to the sprite sheet.

Parameters​

  • name

    • Type: string
    • The name of the animation.

  • animation

    • Type: SpriteSheetAnimation
    • The animation to add.

Return​

SpriteSheet The spritesheet.

Example​

const animation = new SpriteSheetAnimation(/* ... */);
const spriteSheet = new SpriteSheet(/* ... */);
spriteSheet.addAnimation('walk', animation);

resetAnimation​

prototype
resetAnimation(): SpriteSheet;

Resets the current animation.

Return​

SpriteSheet The spritesheet.

Example​

const spriteSheet = new SpriteSheet(/* ... */);
spriteSheet.addAnimation('attack', /* ... */);
spriteSheet.setAnimation('attack');
//...
spriteSheet.resetAnimation();

setAnimation​

prototype
setAnimation(name: string, reset: boolean = true): SpriteSheet;

Sets the current animation.

Parameters​

  • name

    • Type: string
    • The name of the animation.

  • reset (optional)

    • Type: boolean
    • Default value: true
    • Whether to reset the animation.

Return​

SpriteSheet The spritesheet.

Example​

const spriteSheet = new SpriteSheet(/* ... */);
spriteSheet.addAnimation('walk', /* ... */);
spriteSheet.setAnimation('walk');

update​

prototype
update(deltaTime: number): void;

Updates the sprite sheet.

Parameters​

  • deltaTime
    • Type: number
    • The time since the last update.

Return​

void

Example​

const spriteSheet = new SpriteSheet(/* ... */);
spriteSheet.addAnimation('walk', /* ... */);
spriteSheet.setAnimation('walk');
//...
spriteSheet.update(deltaTime);

draw​

prototype
draw(context: CanvasRenderingContext2D): void;

Draws the sprite sheet.

Parameters​

  • context
    • Type: CanvasRenderingContext2D
    • The context to draw on.

Return​

void

Example​

const spriteSheet = new SpriteSheet(/* ... */);
spriteSheet.addAnimation('walk', /* ... */);
spriteSheet.setAnimation('walk');
//...
spriteSheet.draw(context);