0

我在这里尝试实现的是我的屏幕上有一个角色，我可以通过按箭头键来左右移动它。

我想要做的是当我点击左边时图像会反转，当我点击右边时它应该反转回来，这样角色总是面向它走路的方式。

我的代码看起来像这样，我定义了原始图像和反向图像：

Game.Hero = function (myX, myY){
var my = new createjs.Bitmap("img/hero.png");
my.reverseHero = function (){
    my.image.src = "img/hero-1.png";
};

然后我在这里有一个代码片段，显示了我是如何解决这个问题的：

my.moveBy = function(dirX, dirY){
    var testX = my.posX + dirX;
    var testY = my.posY + dirY;
    if (testX < 0 || testY < 0 || testX > 21 || testY > 8){
        return;
    }
    if (dirX === -1){
       my.reverseHero();

    } else if (dirX === 1) {
        Game.stage.addChild(Game.hero);                
    }

我现在的问题是，当我向左走时，图像实际上会反转，但是当我再次尝试向右走时，图像不会反转。

所以代码实际上只运行第一个 if 语句，并且一直挂在那里。

你有什么建议可能是错的吗？

4

2 回答 2

2

你不是应该在设置后重置图像吗？这意味着设置第二个函数以将英雄返回到他的原始图像。因为现在它只是在调用该动作时将您的角色设置为另一个图像，但这会保持该图像设置，即使不再调用该动作也是如此。

Game.Hero = function (myX, myY){
var my = new createjs.Bitmap("img/hero.png");
my.reverseHero = function (){
    my.image.src = "img/hero-1.png";
};
my.returnHero = function(){
    my.image.src = "img/hero.png";
};

然后，在 else if 语句中，调用该函数

my.moveBy = function(dirX, dirY){
    var testX = my.posX + dirX;
    var testY = my.posY + dirY;
    if (testX < 0 || testY < 0 || testX > 21 || testY > 8){
        return;
    }
    if (dirX === -1){
       my.reverseHero();
    } else if (dirX === 1) {
        Game.stage.addChild(Game.hero);                
        my.returnHero();
    }

这对您有意义吗，还是我应该再澄清一些？

于 2013-11-11T16:19:31.460 回答
1

出了什么问题，您使用 初始化图像"img/hero.png"，然后将其更改为"img/hero-1.png"。这很好，但是，当您reverseHero第二次调用该方法时，它不会放回旧图像 ( "img/hero.png")。

你可以通过实现这样的东西来改变它：

var direction = true; // true means forward, false means backwards
my.reverseHero = function (){
    my.image.src = direction ? "img/hero-1.png" : "img/hero.png";
    direction = !direction;
};
于 2013-11-11T16:18:25.353 回答