Skip to main content

TiledAnimation

Create an Animation given a list of frames in AnimationOptions

To create an Animation from a SpriteSheet, use Animation.fromSpriteSheet

Hierarchy

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Properties

publicinheriteddata

data: Map<string, any>

publicinheritedevents

events: EventEmitter<AnimationEvents> = ...

publicinheritedframeDuration

frameDuration: number = 100

publicinheritedframes

frames: Frame[] = []

readonlyinheritedid

id: number = ...

publicinheritedopacity

opacity: number = 1

Gets or sets the opacity of the graphic, 0 is transparent, 1 is solid (opaque).

publicready

ready: Promise<void> = ...

publicinheritedshouldAlwaysTick

shouldAlwaysTick: boolean = false

Optional property to tick any graphics EVEN when offscreen, this is useful when you want to keep animations synchronized across your game scene.

publicinheritedshowDebug

showDebug: boolean = false

Gets or sets wether to show debug information about the graphic

publicinheritedstrategy

strategy: AnimationStrategy = AnimationStrategy.Loop

publicoptionalinheritedtint

tint?: Color

publicinheritedtransform

transform: AffineMatrix = ...

Accessors

publicinheritedcanFinish

  • get canFinish(): boolean

  • Returns true if the animation can end

    Returns boolean

publicinheritedcurrentFrame

  • get currentFrame(): Frame | null

publicinheritedcurrentFrameIndex

  • get currentFrameIndex(): number

  • Returns the current frame index of the animation

    Use Animation.currentFrame to grab the current Frame object

    Returns number

publicinheritedcurrentFrameTimeLeft

  • get currentFrameTimeLeft(): number

  • Returns the amount of time in milliseconds left in the current frame

    Returns number

publicinheriteddirection

  • Returns the current play direction of the animation

    Returns AnimationDirection

publicinheriteddone

  • get done(): boolean

  • Returns true if the animation is done, for looping type animations ex.AnimationStrategy.PingPong and ex.AnimationStrategy.Loop this will always return false

    See the ex.Animation.canFinish() method to know if an animation type can end

    Returns boolean

publicinheritedflipHorizontal

  • get flipHorizontal(): boolean
  • set flipHorizontal(value: boolean): void

  • Gets or sets the flipHorizontal, which will flip the graphic horizontally (across the y axis)

    Returns boolean

  • Parameters

    • value: boolean

    Returns void

publicinheritedflipVertical

  • get flipVertical(): boolean
  • set flipVertical(value: boolean): void

  • Gets or sets the flipVertical, which will flip the graphic vertically (across the x axis)

    Returns boolean

  • Parameters

    • value: boolean

    Returns void

height

  • get height(): number
  • set height(height: number): void

  • Gets or sets the height of the graphic (always positive)

    Returns number

  • Parameters

    • height: number

    Returns void

publicinheritedisPlaying

  • get isPlaying(): boolean

  • Returns true if the animation is playing

    Returns boolean

publicinheritedisReversed

  • get isReversed(): boolean

  • Returns boolean

publicinheritedlocalBounds

  • Gets a copy of the bounds in pixels occupied by the graphic on the the screen. This includes scale.

    Returns BoundingBox

publicinheritedorigin

  • get origin(): Vector | undefined
  • set origin(value: Vector | undefined): void

  • Gets or sets the origin of the graphic, if not set the center of the graphic is the origin

    Returns Vector | undefined

  • Parameters

    Returns void

publicinheritedrotation

  • get rotation(): number
  • set rotation(value: number): void

  • Gets or sets the rotation of the graphic

    Returns number

  • Parameters

    • value: number

    Returns void

publicinheritedscale

  • Gets or sets the scale of the graphic, this affects the width and

    Returns Vector

  • Parameters

    Returns void

sourceView

publicinheritedspeed

  • get speed(): number
  • set speed(val: number): void

  • Current animation speed

    1 meaning normal 1x speed. 2 meaning 2x speed and so on.

    Returns number

  • Current animation speed

    1 meaning normal 1x speed. 2 meaning 2x speed and so on.

    Parameters

    • val: number

    Returns void

width

  • get width(): number
  • set width(width: number): void

  • Gets or sets the width of the graphic (always positive)

    Returns number

  • Parameters

    • width: number

    Returns void

Methods

publicinheritedclone

  • clone<T>(): InstanceType<T>

  • Returns a new instance of the graphic that has the same properties

    Type parameters

    Returns InstanceType<T>

publicinheritedcloneGraphicOptions

publicinheriteddraw

  • Draw the whole graphic to the context including transform

    Parameters

    Returns void

publicinheritedgoToFrame

  • goToFrame(frameNumber: number, duration?: number): void

  • Jump the animation immediately to a specific frame if it exists

    Optionally specify an override for the duration of the frame, useful for keeping multiple animations in sync with one another.

    Parameters

    • frameNumber: number
    • optionalduration: number

    Returns void

publicinheritedisStale

  • isStale(): boolean

  • Returns boolean

publicinheritedpause

  • pause(): void

  • Pauses the animation on the current frame

    Returns void

publicinheritedplay

  • play(): void

  • Plays or resumes the animation from the current frame

    Returns void

publicinheritedreset

  • reset(): void

  • Reset the animation back to the beginning, including if the animation were done

    Returns void

publicinheritedreverse

  • reverse(): void

  • Reverses the play direction of the Animation, this preserves the current frame

    Returns void

publicinheritedtick

  • tick(elapsed: number, idempotencyToken?: number): void

  • Called internally by Excalibur to update the state of the animation potential update the current frame

    Parameters

    • elapsed: number

      Milliseconds elapsed

    • idempotencyToken: number = 0

      Prevents double ticking in a frame by passing a unique token to the frame

    Returns void

publicstaticfromAnimation

publicstaticinheritedfromSpriteSheet

  • fromSpriteSheet<T>(this: T, spriteSheet: SpriteSheet, spriteSheetIndex: number[], durationPerFrame: number, strategy?: AnimationStrategy, data?: Record<string, any>): InstanceType<T>

  • Create an Animation from a SpriteSheet, a list of indices into the sprite sheet, a duration per frame and optional AnimationStrategy

    Example:

    const spriteSheet = SpriteSheet.fromImageSource({...});

const anim = Animation.fromSpriteSheet(spriteSheet, range(0, 5), 200, AnimationStrategy.Loop);

    Type parameters

    Parameters

    • this: T
    • spriteSheet: SpriteSheet

      ex.SpriteSheet

    • spriteSheetIndex: number[]

      0 based index from left to right, top down (row major order) of the ex.SpriteSheet

    • durationPerFrame: number

      duration per frame in milliseconds

    • strategy: AnimationStrategy = AnimationStrategy.Loop

      Optional strategy, default AnimationStrategy.Loop

    • optionaldata: Record<string, any>

    Returns InstanceType<T>

publicstaticinheritedfromSpriteSheetCoordinates

  • Create an Animation from a SpriteSheet given a list of coordinates

    Example:

    const spriteSheet = SpriteSheet.fromImageSource({...});

const anim = Animation.fromSpriteSheetCoordinates({
 spriteSheet,
 frameCoordinates: [
   {x: 0, y: 5, duration: 100, options { flipHorizontal: true }},
   {x: 1, y: 5, duration: 200},
   {x: 2, y: 5},
   {x: 3, y: 5}
 ],
 strategy: AnimationStrategy.PingPong
});

    Type parameters

    Parameters

    Returns InstanceType<T>

    Animation

Page Options