Jump to content

Animations Interrupt One Another


frankdev
 Share

Recommended Posts

Hello all, 

 

I was wondering if there was a way to make sure an animation plays until completion. In my code, I start one animation when a certain condition is met. I want the animation to play to completion even though the condition isn't met throughout. Is this possible using built in Phaser methods?

 

Thanks!

Link to comment
Share on other sites

An animation will play through to the end by default, unless interrupted, so the way to approach the problem is to ensure that you're not interrupting it by checking the isPlaying property, or using the onComplete event - or creatively using both, so that if you want an animation to happen AFTER the current one has finished, you could do something like this:

sprite.animations.play("anim1", 30, false);function playWhenFinished(name) {  // is this sprite currently animating?  if (sprite.isPlaying) {    // yes, so play the next animation when this one has finished    sprite.animations.onComplete.addOnce(function() {      sprite.animations.play(name, 30, false);    }, this);  }  else {    // no, so play the next animation now    sprite.animations.play(name, 30, false);    }}

You could then extend this with a bit more work to hold a queue of animations to play in sequence, removing each one as it gets played until the queue is emptied.

Link to comment
Share on other sites

  • 2 months later...

      var portal = game.add.sprite(portalX, portalY, 'portal-frog');      portal.animations.add('portal', Phaser.Animation.generateFrameNames('portal-', 0, 55));      portal.animations.add('portal-idle', Phaser.Animation.generateFrameNames('portal-', 56, 77));      portal.animations.play('portal', 10, false);      portal.animations.onComplete.addOnce(function () {        portal.animations.play('portal-idle', 10, true);      }, this);

Hi everyone!

I try to implement this approach but got a error:

Uncaught TypeError: Cannot read property 'addOnce' of undefined

 

For this line:

portal.animations.onComplete.addOnce(function () {

what i'm doing wrong?

Thanks!

Link to comment
Share on other sites

  • 10 months later...

This also works with Tweens I have come to find out after reading lewster32's answer: 

if( typeof markerMove !== 'undefined' ){ if( !markerMove.isRunning )  markerMove = this.add.tween(BasicGame.marker)   .to({ x: position }, 300, Phaser.Easing.Quadratic.InOut, true, 0, 0, false);} else {  markerMove = this.add.tween(BasicGame.marker)   .to({ x: position }, 300, Phaser.Easing.Quadratic.InOut, true, 0, 0, false);}

If anyone can make this a little more concise, I'd be interested to see that.

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

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