Keyboard Movement

[P4nch0]

Hello!

I want to create full keyboard movement in my game but i have a problem. I am trying and trying a lot of way and nothing. Now i ended on this:

  if(this.cursors.left.isDown) {      this.player.animations.play('left');      this.lastanimation = 'left';          this.player.body.velocity.x -= 70;    }    else if(this.cursors.right.isDown) {      this.player.animations.play('right');      this.lastanimation = 'right';           this.player.body.velocity.x += 70;    }               else if(this.cursors.up.isDown) {      this.player.animations.play('up');      this.lastanimation = 'up';       this.player.body.velocity.y -= 70;    }    else if(this.cursors.down.isDown) {      this.player.animations.play('down');      this.lastanimation = 'down';       this.player.body.velocity.y += 70;       }              else {        this.player.animations.stop();        this.player.frame = 0;        }                       },

Want to move my sprite in 4 directions , and when holding the one arrow , I would like to push the second and chenge sprite direction . Now that I have, but not quite. Holding the left arrow and press the down sprite still goes to the left , but  holding down and pressing the left nice change direction. I know that is because IF and else is conditional, but maybe anyone have way to do good keyboard movement with animations?

How it work you can look on my page : http://lifetime.cba.pl

LOGIN : test

PASSWORD : test.

 

Then click "GRAJ" to load the game.

 

I will be grateful for help.
 

[Nikow]

If u change else if by if only ?

[P4nch0]

When i want onfly If i must do it that :

 

   if (this.cursors.left.isDown || this.cursors.right.isDown || this.cursors.up.isDown || this.cursors.down.isDown){           if(this.cursors.left.isDown) {      this.player.animations.play('left');      this.lastanimation = 'left';          this.player.body.velocity.x -= 70;    }     if(this.cursors.right.isDown) {      this.player.animations.play('right');      this.lastanimation = 'right';           this.player.body.velocity.x += 70;    }                if(this.cursors.up.isDown) {      this.player.animations.play('up');      this.lastanimation = 'up';       this.player.body.velocity.y -= 70;    }    if(this.cursors.down.isDown) {      this.player.animations.play('down');      this.lastanimation = 'down';       this.player.body.velocity.y += 70;       }      }         else {        this.player.animations.stop();        this.player.frame = 0;        }                       },

Then my sprite is going to the cross. This is fine to, but when it going cross animations animations doesn't play.

 

[XekeDeath]

Separate your movement and sprite logic.

Try putting the sprite logic in keydown events, and leave the move logic in update function.

[P4nch0]

What do You mean by logic?
I am begginer, can you give me some example what do You mean?

How i can separate it?

[XekeDeath]

You have 2 goals here:

Pressing keys moves a sprite around the screen.

Pressing a direction will make the sprite face in that direction.

 

You currently have both of these things happening in the same place, but they are not completely compatiable with each other.

You want a character going left to face down in the right circumstances.

 

I suggest putting the logic for controlling what animation to play in keypress functions, rather than the update funciton, because you don't need to tell it to play every frame. Only when a key is pressed.

 

For each of your cursors, you can add functions to the onDown event that will change the animation that is playing.

this.cursors.up.onDown.add(function() {    this.player.animations.play('up');}, this);

Then, in your update function, you can put the movement code you have, but include a way to stop playing the animation.

I wouldn't put the stop in a keyUp event because you don't want to stop the animation if one of 2 pressed keys is released.

var stopAnim = false;// Your movement code here... If any key is down, set stopAnim to true...if (stopAnim){    this.player.animations.stop();    this.player.frame = 0;}

[P4nch0]

Very thanks man, You opened me new perspective  on my problem

 

I done it that :

 

update : function(){  var stopanim = true;      if(this.cursors.left.isDown) {         this.player.body.velocity.x -= 70;        var stopanim = false;    }       if(this.cursors.right.isDown) {         this.player.body.velocity.x += 70;        var stopanim = false;    }                   if(this.cursors.up.isDown) {      this.player.body.velocity.y -= 70;        var stopanim = false;    }      if(this.cursors.down.isDown) {       this.player.body.velocity.y += 70;        var stopanim = false;       }              if (stopanim) {        this.player.animations.stop();        this.player.frame = 0;        }           this.cursors.up.onDown.add(function() {    this.player.animations.play('up');}, this); this.cursors.down.onDown.add(function() {    this.player.animations.play('down');}, this);            this.cursors.right.onDown.add(function() {    this.player.animations.play('right');}, this);this.cursors.left.onDown.add(function() {    this.player.animations.play('left');}, this);            },

Now is good, on every directions i have good anim but is one problem else. Everythink is good but when i am holding for example cursor left (lef animations is playing) then press cursos fo example up (up animation is playing) and then when i up cursor up (up animation is playing) when i am holding cursor left. Is any way to do it better?

I udpated files on my page, You can look how it work. Thanks a lot for help.

[P4nch0]

Anyone have idea how to do it?

Its problem now how to stop playing animation when key is up, beacause when i press key down animation down is playing, then when i press right key, animation right is playing, but when i up key right and still press key down i still have animation right.
Please anyone help i will be gratefull