jonteferm

Animation does not finish

Recommended Posts

Hey,

I've got a function call on isDown for the left mouse button. This function checks the direction and then plays an animation of two frames. Like this:

if(this.lastDirection === "down"){
	this.animations.play("hitDown");
}else if(this.lastDirection === "left"){
	this.animations.play("hitLeft");
}else if(this.lastDirection === "right"){
	this.animations.play("hitRight");
}

For example hitDown looks like this:

this.animations.add('hitDown', [16,17], 5, true);

The thing is; when I run "this.animations.play" - I expect theboth animation frames to just run but they're not. The whole animation does not run unless I hold the mousebutton pressed. If i just click - only the first frame in the animation shows. Why is that?

Share this post


Link to post
Share on other sites

I usually don't set the FPS when calling play, only when adding the animations to the AnimationManager via this.animations.add. There, FPS defaults to 60. I wonder if you're calling play on another animation before the first one finishes?

Share this post


Link to post
Share on other sites
1 hour ago, drhayes said:

I usually don't set the FPS when calling play, only when adding the animations to the AnimationManager via this.animations.add. There, FPS defaults to 60. I wonder if you're calling play on another animation before the first one finishes?

Hmm, yes. Part of the problem appears to be that I played the idle mode as an animation. Like "if no key input -> play idle". Really stupid of me to have idle as an animation.

}else if(this.wasd.right.isDown){
	this.body.velocity.x = 100;
    this.animations.play("right");
	this.lastDirection = "right";
}else{
	this.animations.stop(false, true);
	/*
	if(this.lastDirection === "up"){
		this.animations.play("idleUp");
	}else if(this.lastDirection === "down"){
		this.animations.play("idleDown");
	}else if(this.lastDirection === "left"){
	    this.animations.play("idleLeft");		
	}else if(this.lastDirection === "right"){
		this.animations.play("idleRight");
	}*/
}

and now the animation plays trough. Hovever... 

Now if I do not provide the FPS parameter - the animation does not get past the first frame. 

if(this.lastDirection === "down"){
	this.animations.play("hitDown", 60, false);
}else if(this.lastDirection === "left"){
    this.animations.play("hitLeft", 60, false);
}else if(this.lastDirection === "right"){
	this.animations.play("hitRight", 60, false);
}

Edit: aaah! unless I hold the button down. Then it keps playing.

Edit: What I also can see is that I really have to hold the button down. Isn't there any way to detect a simple press on the button?

Share this post


Link to post
Share on other sites

Glad we're making progress, but I'm not sure what you're asking. You are detecting the simple press of a button. When making sure the player animation looks right I use a full-blown state machine to ensure that animations finish before going to the next and they transition correctly. You might end up doing something similar.

Share this post


Link to post
Share on other sites
On 2016-12-29 at 6:33 PM, drhayes said:

Glad we're making progress, but I'm not sure what you're asking. You are detecting the simple press of a button. When making sure the player animation looks right I use a full-blown state machine to ensure that animations finish before going to the next and they transition correctly. You might end up doing something similar.

Okey, yes that is true. I thought of it in the wrong way. I guess my problem is that during the next frame, it enters the else - where the animation stops - as I am no longer holding down the button. So what i probably have to do; is to flag in some way that a animation is still in play and in that case prevent the animations.stop() even though it enters the else. However, I am under the impression that this is exactly what should be solved by the second parameter in my call to the animations.stop() function (dispatchComplete) which I set to true. Maybe I got that wrong.

Share this post


Link to post
Share on other sites

What version of Phaser are you using? The params switched sometime between 2.4.2 and 2.6. In 2.6 the docs for AnimationManager.stop say the second param is "resetFrame": "When the animation is stopped should the currentFrame be set to the first frame of the animation (true) or paused on the last frame displayed (false) (defaults to false)". Just wondering if that's messing things up, too.

Share this post


Link to post
Share on other sites
On 2017-01-03 at 8:02 PM, drhayes said:

What version of Phaser are you using? The params switched sometime between 2.4.2 and 2.6. In 2.6 the docs for AnimationManager.stop say the second param is "resetFrame": "When the animation is stopped should the currentFrame be set to the first frame of the animation (true) or paused on the last frame displayed (false) (defaults to false)". Just wondering if that's messing things up, too.

I'm using 4.7. Seems like it is the same params. But hey, I solved it. By just removing that damned else condition and adding this instead:

this.events.onAnimationComplete.add(function(){			
	this.animations.stop(true, true);	
}, this);

Thanks for looking into this!

Share this post


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.