Jump to content

How to adjust the animation loop interval


Recommended Posts

I'm animating a gloss of a sign . It consists of multiple images and a json file containing the metadata.

I'm using the following code to animate the sprite :

  initializeAnimation(jsonPath: string, speed = 1, loop = true, play = true ){
    let sheet = this.app.loader.resources[jsonPath]
    let anim = new PIXI.AnimatedSprite(sheet.spritesheet.animations['GAME'])
    anim.loop = loop
    anim.animationSpeed = speed
    if (play) anim.play()
    return anim
  }

How can I change the periods between the animation loops ? Currently it infinitely loops , I want to loop each 5 sec. for example .

I have tried using the anim.update() function , setting intervals of the play() function , adding to the app.ticker , but it just repeats once and doesn't play anymore. Am I missing something (rendering maybe) ?

Link to post
Share on other sites

I made it work , not sure if that is the right / best way to be done :

initializeAnimation(jsonPath: string, speed = 1, loop = false, play = true ){
    let sheet = this.app.loader.resources[jsonPath]
    let anim = new PIXI.AnimatedSprite(sheet.spritesheet.animations['GAME'])
    anim.loop = loop
    anim.animationSpeed = speed
    if (play) {
      this.playAnimation(anim,4000)
    }
    return anim
  }

  playAnimation(animation: any, timeout: number){
    setInterval( () => {
        animation.gotoAndPlay(0)
        this.app.render()
      }, timeout)
  }

 

The problem was that I was not returning to frame 0 .

Please let me know if there is a better way of doing this ?

Link to post
Share on other sites

pixi AnimatedSprite is the basic class, usually people extend it and override with their own animations. `PIXI.Ticker` is not enough for animations too.

In general, pixi doesnt have animation manager. Either you code your own, either you use GSAP (look in pixi examples), either you use another plugin like `pixi-actions`, mentioned here: https://github.com/pixijs/pixijs/wiki/v5-Resources#tweens--animation .

For current pixi version, there's no right way on doing animations. That problem is much easier than rendering, users can do it on their own, no one provided good enough implementation to merge into pixi, e.t.c.

Edited by ivan.popelyshev
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...