clovis2 October 13th, 2014 Hello!
I want to walk through an animation on mouse click. Here is the code of my behavior file:
LightItem = function() { this.onAddToScene = function() { wade.addEventListener(this.owner, 'onMouseDown'); } this.onMouseDown = function() { var sprite = this.owner.getSprite(0); var anim = sprite.getAnimation("Piece"); anim.step(); };};//@ sourceURL=match3Item.jsAny way I try to define my animation parameters, the animation is displayed but doesn't step on click.
What is my mistake?
Please help :(
foxcode October 14th, 2014 Hello!
The step function increments time for the animation by the simulation rate. so lets say our simulation rate is 30fps or 1/30.
That is how much time will be added to our animation. If our animation is set to run slower, say 10fps, step would need to be called 3 times to make anything happen.
I think it is confusing, the function name is a bit misleading and we will aim to include a function that moves to the next animation frame by the next release.
Right now I will come up with a work around for you, but thank you for bringing this issue up, I will be back soon :)
Gio October 14th, 2014 Like foxcode said, step advances the animation by the default time step (16.67 milliseconds unless you change it).
There is however a setFrameNumber function that you can use:
var frameNumber = 0;this.onMouseDown = function(){ var sprite = this.owner.getSprite(0); var anim = sprite.getAnimation("Piece"); // calculate next frame number frameNumber = (frameNumber + 1) % anim.getFrameCount(); // set frame number anim.setFrameNumber(frameNumber);};
foxcode October 14th, 2014 Okay, I have found a way to do what you want. It isn't amazingly pretty but it seems to work.
Like I said above, step() increments by the simulation rate, which you can access via wade.c_timeStep
if we set the animation's speed to 1/wade.c_timeStep, then in theory, every time step is called the animation frame should be updated, hopefully giving you
the behavior you want. If you have any questions please reply to this thread :)
LightItem = function(){ this.onAddToScene = function() { wade.addEventListener(this.owner, 'onMouseDown'); }; // This semi colon was missing this.onMouseDown = function() // This is unchanged from your program { var sprite = this.owner.getSprite(0); var anim = sprite.getAnimation("Piece"); anim.step(); };};App = function(){ this.load = function() { wade.loadImage('animExample.png'); // Remember to use your own animation not mine :p }; this.init = function() { var mySprite = new Sprite(); // Empty sprite // Again own animation cells, but 1/wade.c_timeStep, false is crucial to do it the way you want var myAnimation = new Animation('animExample.png', 13, 2, 1/wade.c_timeStep, false); mySprite.addAnimation("Piece", myAnimation); var myObject = new SceneObject(mySprite, LightItem); wade.addSceneObject(myObject); myAnimation.stop(); // This is very important, must have it after adding the scene object to the scene };};
foxcode October 14th, 2014 Gio I tested your solution, it is similar to my first attempt at solving this and it doesn't work, I just tested it in my sample. I tried it with animation playing, not playing, speed 0, speed 30, with animation stop, without it. None of those worked, I think there is a bug somewhere in those functions. I looked at the wade pro code but couldn't find anything wrong. For the mean time my solution is the only one I could get working
Gio October 14th, 2014 Yes, I think there is a bug with setFrameNumber, as it doesn't appear to trigger a redraw of the sprite. It'll be fixed in the next release. A workaround is calling sprite.setDirtyArea() after setFrameNumber - or use foxcode's solution.
Either way, it is important that you call anim.stop() after adding the animation to the scene, otherwise it'll play it automatically, overriding anything you try to do manually.
clovis2 October 15th, 2014 Hello!
The Foxcode's solution works fine! As I want to wrap around my animation, I have to put "true" in "looping" parameter while creating the animation.
I didn't retry the "setFrameNumber" with redraw forcing.
Thanks to you both :)
foxcode October 15th, 2014 You're welcome clovis2, glad it worked for you :)