CODEWITHSUNDEEP
javascriptphaser-framework
Gabriel Wood
Gabriel Wood

Reputation: 27

Phaser 3 How to run a spritesheet animation AND move

I have a spritesheet for the "player". As you press the arrow keys, it moves around. However, I can only get it to run the animation AFTER moving, or something similar where you can only move OR run the animation. I need it to move AND run the animation. Here is the relevant code so far-

var cursors;
var player;
class Scene1 extends Phaser.Scene {
  constructor() {
    super("bootGame");
  }
  preload() {
    this.load.spritesheet(
    "player",
    "https://cdn.glitch.com/34a2793c-cdda-4b47-b469-f0357b9fc0f1%2FAH_SpriteSheet_People2.png? 
    v=1595522143234",
      { frameWidth: 16, frameHeight: 16 }
    );
  }
  create() {        
    player = this.add.sprite(30, 30, "player");
    this.anims.create({
      key: "left",
      frames: this.anims.generateFrameNumbers("player", { start: 12, end: 14 }),
      frameRate: 10,
      repeat: 1
    });
    cursors = this.input.keyboard.createCursorKeys();
    update() {
      if (cursors.left.isDown) {
        player.anims.play("left");
        player.x -= 1;
      }
    }
  }

Upvotes: 0

Views: 479

Answers (1)

Lee
Lee

Reputation: 587

Try: (the second parameter is for ignoreIfPlaying)

player.anims.play("left",true);

I think what is happening is the default of false for the second parameter is restarting the animation. This will make it look like it isn't playing because it only completes after you release the left key. the true will allow it to play through before it tries to restart it (while holding the left)

Upvotes: 1

Related Questions