1

我发现该方法存在一些问题，该loadTexture()方法用于更改精灵的纹理。我发现的问题之一是加载新纹理后播放的精灵表似乎会跳过，如下所示：http ://cl.ly/text/123S1n2r1m35

（这是该示例的代码：）

// Constants
var GAME_WIDTH = 800;
var GAME_HEIGHT = 600;

var TEXT_X_POS = 260;
var TEXT_Y_POS = 100;

var ALL_FRAMES = null;
var FRAME_RATE = 15;
var LOOP = true;

var SPRITE_X_POS = 300;
var SPRITE_Y_POS = 300;


// New instance of Phaser.Game
var game = new Phaser.Game(GAME_WIDTH, GAME_HEIGHT, Phaser.AUTO, "game", { preload: preload, create: create, update: update });

var sprite;

function preload () {
    game.load.atlas("robot", "sprites/running_bot.png", "sprites/running_bot.json");
    game.load.atlas("sea_creature", "sprites/seacreature.png", "sprites/seacreature.json");
}

function create () {
    game.add.text(TEXT_X_POS, TEXT_Y_POS, "Click to change texture", {fontSize: "16px", fill: "white"});
    sprite = game.add.sprite(SPRITE_X_POS, SPRITE_Y_POS, "robot");
    sprite.animations.add("robot", ALL_FRAMES, FRAME_RATE, LOOP);
    sprite.animations.add("sea_creature", ALL_FRAMES, FRAME_RATE, LOOP);
    sprite.animations.play("robot");
}

function update () {
    game.input.onDown.add(changeTexture, sprite);
}

function changeTexture () {
    sprite.loadTexture("sea_creature");
    sprite.animations.play("sea_creature");
}

你会看到海洋生物的动画似乎跳过了，我自己的精灵也有同样的问题，所以这个问题并不特定于那个特定的纹理。

我发现的另一个问题是，当将新纹理加载到精灵上时，原始精灵表的大小会保留在该精灵上。例如：http ://cl.ly/3F0C2k1G1G2z

（这是此示例的代码：）

// Constants
var GAME_WIDTH = 800;
var GAME_HEIGHT = 600;

var CHANGE_TEXTURE_TEXT_X_POS = 260;
var CHANGE_TEXTURE_TEXT_Y_POS = 100;

var ARROW_KEYS_TEXT_X_POS = 260;
var ARROW_KEYS_TEXT_Y_POS = 170;

var SPRITE_X_POS = 300;
var SPRITE_Y_POS = 300;

var WALL_X_POS = 600;
var WALL_Y_POS = 225;

var STOPPED = 0;
var SPRITE_RIGHT_VELOCITY = 150;
var SPRITE_LEFT_VELOCITY = -150;
var SPRITE_UP_VELOCITY = -150;
var SPRITE_DOWN_VELOCITY = 150;


// New instance of Phaser.Game
var game = new Phaser.Game(GAME_WIDTH, GAME_HEIGHT, Phaser.AUTO, "game", { preload: preload, create: create, update: update });

var sprite;
var wall;
var cursorKeys;

function preload () {
    game.load.image("master", "sprites/master.png");
    game.load.image("melon", "sprites/melon.png");
    game.load.image("rectangle", "sprites/Rectangle.png");
}

function create () {
    game.add.text(CHANGE_TEXTURE_TEXT_X_POS, CHANGE_TEXTURE_TEXT_Y_POS, "Click to change texture", {fontSize: "16px", fill: "white"});
    game.add.text(ARROW_KEYS_TEXT_X_POS, ARROW_KEYS_TEXT_Y_POS, "Use arrow keys to move", {fontSize: "16px", fill: "white"});
    sprite = game.add.sprite(SPRITE_X_POS, SPRITE_Y_POS, "master");
    game.physics.arcade.enable(sprite);

    wall = game.add.sprite(WALL_X_POS, WALL_Y_POS, "rectangle");
    game.physics.arcade.enable(wall);
    wall.body.immovable = true;

    cursorKeys = game.input.keyboard.createCursorKeys();
}

function update () {
    game.physics.arcade.collide(sprite, wall);

    game.input.onDown.add(changeTexture, sprite);

    sprite.body.velocity.x = STOPPED;
    sprite.body.velocity.y = STOPPED;

    if (cursorKeys.right.isDown) {
        sprite.body.velocity.x = SPRITE_RIGHT_VELOCITY;
    }
    if (cursorKeys.left.isDown) {
        sprite.body.velocity.x = SPRITE_LEFT_VELOCITY;
    }
    if (cursorKeys.up.isDown) {
        sprite.body.velocity.y = SPRITE_UP_VELOCITY;
    }
    if (cursorKeys.down.isDown) {
        sprite.body.velocity.y = SPRITE_DOWN_VELOCITY;
    }
}

function changeTexture () {
    sprite.loadTexture("melon");
}

您会在这里看到第一个纹理与墙壁碰撞得很好，但是当新的较小纹理加载到精灵上时，它的原始大小仍然存在。这使得游戏看起来有问题，并且精灵实际上并没有与墙壁发生碰撞。同样，这个问题并不是这个例子所特有的，因为我自己的精灵也有同样的问题。

我真的需要一种方法来解决这种loadTexture()方法的这些问题，因为它们已经让我对自己的项目感到非常痛苦。

4

1 回答 1

3

关于精灵大小的问题：

只需在加载新纹理后将精灵的大小设置为新纹理，如下所示：

function changeTexture () {
    sprite.loadTexture("melon");
    sprite.body.setSize(newTexture.width, newTexture.height);
}

关于跳过动画的问题：

首先必须做的是准确指定要使用的帧，而不是仅仅将frames参数设置为空。其次，为新纹理添加新动画的特定行必须放在加载新纹理的方法中，如下所示：

function changeTexture () {
    sprite.loadTexture("sea_creature");
    sprite.animations.add("sea_creature", specificFramesToUse, frameRate, whetherToLoop, whetherToUseANumericIndex);
    sprite.animations.play("sea_creature");
}
于 2014-08-20T04:49:26.020 回答