javascript - Phaser - 创建播放器对象

Question

我正在学习本教程，https://phaser.io/examples/v2/sprites/extending-sprite-demo-2 ，我有以下内容:

MonsterBunny = function (game, x, y, rotateSpeed) {
    Phaser.Sprite.call(this, game, x, y);
    var test = game.add.sprite(x, y, 'player');
    test.rotateSpeed = rotateSpeed;
};
MonsterBunny.prototype = Object.create(Phaser.Sprite.prototype);
MonsterBunny.prototype.constructor = MonsterBunny;
MonsterBunny.prototype.update = function() {
    this.angle += this.rotateSpeed;
    console.log('a');
};

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

function preload() {
    game.load.crossOrigin = 'anonymous';
    game.load.image('player', 'http://examples.phaser.io/_site/images/prize-button.png');
}

function create() {
    var wabbit = new MonsterBunny(game, 0, 100, 1);
    var wabbit2 = new MonsterBunny(game, 150, 100, 0.5);
}

JSFiddle

Sprite 不再旋转，update 函数不再记录到控制台。我该如何解决？谢谢。

Answer 1

您的代码中有两个错误。

首先，在您的 MonsterBunny 构造函数中，您要添加 2 个 Sprite 而不是 1 个。 var test = game.add.sprite.. 不应该存在，因为 Sprite 已经通过调用 Sprite 构造函数添加 Phaser.Sprite.call .

其次，在调用 Phaser.Sprite 构造函数时，您忘记添加 key 参数，因此要使用哪个图像，在您的情况下它称为 '播放器'。因此，它实际上添加了一个 Sprite ，但根本不显示。

所以，像这样的东西应该可以工作:

MonsterBunny = function (game, x, y, rotateSpeed) {
    // call sprite constructor to create sprite
    Phaser.Sprite.call(this, game, x, y, 'player');

    // set extra variables
    this.rotateSpeed = rotateSpeed;
    this.anchor.setTo(0.5, 0.5); // for centered rotation

    // add sprite to game world
    game.add.existing(this);
};