Jump to content

Problems with sprite animations


sigmasoldier
 Share

Recommended Posts

Hello everyone, currently I'm developing a small game and I want to have multiple animation sets from the same sprite sheet, they're done with aseprite.

I've implemented a simple loader (in typescript), which loads all the sprite stuff correctly (json atlas), but when generating the animations it stops working if I specify the start and end properties of the configuration object, for the Scene::anims#generateFrameNames(string, object) method.

Note that the error is thrown when using the animation, not when creating it! Also anim comes from a valid array of objects (As they work when not using "tags").

Animation.js:1006 Uncaught (in promise) TypeError: Cannot read property 'frame' of undefined
    at Animation.setCurrentFrame (Animation.js:1006)
    at Animation.updateFrame (Animation.js:1041)
    at Animation.load (Animation.js:509)
    at AnimationManager.load (AnimationManager.js:438)
    at Animation.load (Animation.js:420)
    at Animation._startAnimation (Animation.js:583)
    at Animation.play (Animation.js:530)
    at Sprite.play (Sprite.js:136)
    at TestDamages.eval (TestDamages.ts:84)
    at step (TestDamages.ts:45)

Code examples (note that it's written in Typescript 3, but the language is not supported)

This works so far:

export class SampleLoad {
  /**
   * Loads the animation object.
   */
  private readonly loadAnimation = (anim: any) => {
    this.anims.create({
      ...anim,
      frames: this.anims.generateFrameNames(anim.frames)
    });
  };
}

However, adding "Tag detection" feature does not, and I'm ensured (Tested so far) that the tag will contain two valid values for tag.from and tag.to:

export class SampleLoad {
  /**
   * Loads the animation object.
   */
  private readonly loadAnimation = (anim: any) => {
    const { meta } = this.cache.json.get('json@' + anim.frames);
    let cfg: any;
    const tag = meta.frameTags.find((s: any) => s.name === anim.tag);
    if (tag && tag.from !== tag.to) {
      cfg = {
        start: tag.from,
        end: tag.to
      };
      console.log('Tag found', tag, cfg, anim);
    }
    this.anims.create({
      ...anim,
      frames: this.anims.generateFrameNames(anim.frames, cfg)
    });
  };
}

Thanks for your help!

PD: The syntax highlight is quite broken, sorry for that...

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...