AnimatedSprite

Defined in: display/AnimatedSprite.ts:15

Extends

• AnimatedSprite

Constructors

Constructor

new AnimatedSprite(config?): AnimatedSprite

Defined in: display/AnimatedSprite.ts:31

Parameters

config?

Partial<AnimatedSpriteProps>

Returns

AnimatedSprite

Overrides

PIXIAnimatedSprite.constructor

Properties

autoPlay

autoPlay: boolean

Defined in: display/AnimatedSprite.ts:27

---

currentAnimation

currentAnimation: string

Defined in: display/AnimatedSprite.ts:28

---

defaultAnimation

defaultAnimation: string

Defined in: display/AnimatedSprite.ts:24

---

defaultAnimationSpeed

defaultAnimationSpeed: number

Defined in: display/AnimatedSprite.ts:25

---

defaultSheet

defaultSheet: undefined | string

Defined in: display/AnimatedSprite.ts:23

---

defaultTexturePrefix

defaultTexturePrefix: string = ''

Defined in: display/AnimatedSprite.ts:22

---

defaultZeroPad

defaultZeroPad: undefined | number

Defined in: display/AnimatedSprite.ts:26

---

onAnimationChange

onAnimationChange: Signal<(currentAnimation) => void>

Defined in: display/AnimatedSprite.ts:16

---

onAnimationComplete

onAnimationComplete: Signal<() => void>

Defined in: display/AnimatedSprite.ts:20

---

onAnimationFrameChange

onAnimationFrameChange: Signal<() => void>

Defined in: display/AnimatedSprite.ts:21

---

onAnimationLoop

onAnimationLoop: Signal<() => void>

Defined in: display/AnimatedSprite.ts:19

---

onAnimationStart

onAnimationStart: Signal<() => void>

Defined in: display/AnimatedSprite.ts:17

---

onAnimationStop

onAnimationStop: Signal<() => void>

Defined in: display/AnimatedSprite.ts:18

Accessors

isReversed

Get Signature

get isReversed(): boolean

Defined in: display/AnimatedSprite.ts:85

Returns

boolean

---

paused

Get Signature

get paused(): boolean

Defined in: display/AnimatedSprite.ts:67

Returns

boolean

Set Signature

set paused(value): void

Defined in: display/AnimatedSprite.ts:71

Parameters

value

boolean

Returns

void

---

speed

Get Signature

get speed(): number

Defined in: display/AnimatedSprite.ts:75

Returns

number

Set Signature

set speed(value): void

Defined in: display/AnimatedSprite.ts:79

Parameters

value

number

Returns

void

Methods

nextAnimation()

nextAnimation(): void

Defined in: display/AnimatedSprite.ts:161

Returns

void

---

play()

play(): void

Defined in: display/AnimatedSprite.ts:151

Starts or resumes the animation playback. If the animation was previously stopped, it will continue from where it left off.

Returns

void

Example

// Basic playback
const sprite = new AnimatedSprite({
    textures: [
        Texture.from('walk1.png'),
        Texture.from('walk2.png'),
    ],
    autoPlay: false
});
sprite.play();

// Play after stopping
sprite.stop();
sprite.currentFrame = 0; // Reset to start
sprite.play(); // Play from beginning

// Play with auto-update disabled
sprite.autoUpdate = false;
sprite.play();
app.ticker.add(() => {
    sprite.update(app.ticker); // Manual updates
});

See

• AnimatedSprite#stop For stopping playback
• AnimatedSprite#gotoAndPlay For playing from a specific frame
• AnimatedSprite#playing For checking play state

Overrides

PIXIAnimatedSprite.play

---

previousAnimation()

previousAnimation(): void

Defined in: display/AnimatedSprite.ts:168

Returns

void

---

reverse()

reverse(): void

Defined in: display/AnimatedSprite.ts:123

Returns

void

---

setAnimation()

setAnimation(animationName, autoPlay): void

Defined in: display/AnimatedSprite.ts:132

Parameters

animationName

string

autoPlay

boolean = true

Returns

void

---

stop()

stop(): void

Defined in: display/AnimatedSprite.ts:156

Stops the animation playback and freezes the current frame. Does not reset the current frame or animation progress.

Returns

void

Example

// Create an animated sprite
const sprite = new AnimatedSprite({
    textures: [
        Texture.from('walk1.png'),
        Texture.from('walk2.png'),
        Texture.from('walk3.png')
    ],
    autoPlay: true
});

// Stop at current frame
sprite.stop();

// Stop at specific frame
sprite.gotoAndStop(1); // Stops at second frame

// Stop and reset
sprite.stop();
sprite.currentFrame = 0;

// Stop with completion check
if (sprite.playing) {
    sprite.stop();
    sprite.onComplete?.();
}

See

• AnimatedSprite#play For starting playback
• AnimatedSprite#gotoAndStop For stopping at a specific frame
• AnimatedSprite#playing For checking play state

Overrides

PIXIAnimatedSprite.stop

---

update()

update(ticker): void

Defined in: display/AnimatedSprite.ts:175

Updates the object transform for rendering. This method handles animation timing, frame updates, and manages looping behavior.

Parameters

ticker

Ticker

The ticker to use for updating the animation timing

Returns

void

Example

// Create an animated sprite with manual updates
const sprite = new AnimatedSprite({
    textures: [
        Texture.from('frame1.png'),
        Texture.from('frame2.png'),
        Texture.from('frame3.png')
    ],
    autoUpdate: false // Disable automatic updates
});

// Manual update with app ticker
app.ticker.add((ticker) => {
    sprite.update(ticker);
});

See

• AnimatedSprite#autoUpdate For controlling automatic updates
• AnimatedSprite#animationSpeed For controlling animation speed
• Ticker For timing system details

Overrides

PIXIAnimatedSprite.update

---

generateTexturesFromProps()

static generateTexturesFromProps(animationName, props?, defaultTexturePrefix?, defaultSheet?, defaultZeroPad?, defaultStartIndex?): Texture<TextureSource<any>>[]

Defined in: display/AnimatedSprite.ts:89

Parameters

animationName

string

props?

Partial<AnimatedSpriteProps>

defaultTexturePrefix?

string = ''

defaultSheet?

SpriteSheetLike = undefined

defaultZeroPad?

number

defaultStartIndex?

number

Returns

Texture<TextureSource<any>>[]