Question

我有一些不会玩的精灵动画，我无法理解为什么。我使用的是最新版本的Phaser，但没有使用社区版。

当我向左转时，我想从第1帧到第0帧当我向右转时，我想从第4帧到第5帧我想在静止时循环第2帧和第3帧。

我做错了什么？

    <!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Phaser - Making your first game, part 1</title>
    <script type="text/javascript" src="js/phaser.min.js"></script>
    <style type="text/css">
        body {
            margin: 0;
        }
    </style>
</head>
<body>

<script type="text/javascript">

var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update });

function preload() {

  game.load.image('sky', 'assets/sky.png');
  game.load.image('ground', 'assets/platform.png');
  game.load.image('star', 'assets/star.png');
  game.load.spritesheet('speeder', 'assets/speederSpritesheetJets.png', 220, 250, 6);

}

var platforms;

function create() {

  //  We're going to be using physics, so enable the Arcade Physics system
  game.physics.startSystem(Phaser.Physics.ARCADE);

  //  A simple background for our game
  game.add.sprite(0, 0, 'sky');

  // The player and its settings
  player = game.add.sprite(220, game.world.height - 150, 'speeder');

  //  We need to enable physics on the player
  game.physics.arcade.enable(player);

  //  Player physics properties. Give the little guy a slight bounce.
  player.body.bounce.y = 0.2;
  player.body.gravity.y = 300;
  player.body.collideWorldBounds = true;

  //  Our three animations, left, right and forward.
  player.animations.add('left', [1, 0], 0.2, true);
  player.animations.add('right', [4, 5], 0.2, true);
  player.animations.add('forward', [2, 3], 0.2, true);

  cursors = game.input.keyboard.createCursorKeys();

}

function update() {

  //  Collide the player and the stars with the platforms
  var hitPlatform = game.physics.arcade.collide(player, platforms);

  //  Reset the players velocity (movement)
  player.body.velocity.x = 0;

  if (cursors.left.isDown)
  {
    //  Move to the left
    player.body.velocity.x = -300;

    player.animations.play('left');
  } else if (cursors.right.isDown)
  {
    //  Move to the right
    player.body.velocity.x = 300;

    player.animations.play('right');
  } else
  {
    //  Stand still
    player.animations.stop();
    player.animations.play('forward');
    player.body.velocity.y = -300;
    console.log(player.animations.currentAnim.isPlaying);

  }

  //  Allow the player to jump if they are touching the ground.
  if (cursors.up.isDown && player.body.touching.down && hitPlatform)
{
    player.body.velocity.y = -350;
  }
}

</script>

</body>
</html>

Answer 1

现在这有点令人困惑，因为您可能已经找到了Phaser 2示例，并在Phaser 3上进行了尝试。在Phaser 3中，将动画添加到游戏对象中，然后可以在所有精灵之间共享。在此示例中，请参见此处：

https://phaser.io/tutorials/making-your-first-phaser-3-game/part5

// this refers to a game object, and player is the sprite

this.anims.create({
    key: 'left',
    frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }),
    frameRate: 10,
    repeat: -1
});

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

Phaser sprite动画不会播放

1 个答案: