Phaser,使按钮单击事件连续

时间:2015-11-30 13:55:48

标签: javascript phaser-framework

我正在使用Phaser.js创建一个地图(tileSprite)并在其上有一些精灵,因为不是所有的精灵都可以进入,我使用相机左右平移。 / p>

我希望用户点击键盘键(左或右)或方向按钮精灵来连续平移相机,直到用户释放控件。

我实现了与this example类似的键盘平移,我按住一个键,相机移动/平移(事件的每一边10个像素),并在按键释放时停止。

但是,当我尝试使用2个精灵按钮实现相同的操作时,每个按钮仅触发1个事件并且每次点击仅平移10个像素。我需要继续射击,直到我放开钥匙。

var panRightButton = game.add.button(800, 5, 'right_pan_btn', onClickAction, this);
    panRightButton.onInputOver.add(onButtonOver, this);
    panRightButton.onInputOut.add(onButtonOut, this);
    panRightButton.onInputDown.add(panScreenRight, this);

    function panScreenRight() {
        game.camera.x += 10;
    }

我尝试过使用布尔标志(isPanning),如果我点击按钮并在发布时为假,则会转为true。并在game.camera.x += 10;上有一个while循环,但它只是减慢并停止了脚本。

function onClickAction() {
     isPanning = true;
}

function onButtonOut() {
      isPanning = false;
}

function onButtonUp() {
      isPanning = false;
}

function panScreenLeft() {
    if (isPanning) {
         game.camera.x -= 10;
    }
}

1 个答案:

答案 0 :(得分:3)

执行此操作的正确方法是使用update方法,但不在循环内。使用标志来确定按钮是否被按下是正常的,但只需让Phaser更新摄像机位置,就像您已链接的示例一样:

function update() {

    //...

    if (isPanningLeft) {
        game.camera.x -= 10;
    } else if (isPanningRight) {
        game.camera.x += 10;
    }

   //...
}

您不需要循环,因为update方法在循环内执行(并且预计会逐帧执行)