Phaser JS如何从textButton.events.onInputDown事件到game.input.onDown事件停止事件传播(触发)?

时间:2014-12-25 21:45:18

标签: javascript events html5-canvas phaser-framework

以下是 JSFiddle

我这里有两件事。

  1. game.input.onDown ,它有一些逻辑(在我的示例中生成粒子)
  2. textButton.events.onInputDown ,其中textButton是 Phaser.Text 对象实例,它执行另一个逻辑。
  3. 问题是:当我点击 textButton 时,会触发两个事件 1 2

    问题是,当我点击 textButton 时,如何防止事件 1 被触发?

    部分代码:

    ...
    //This event is fired on click anywhere event # 1
    game.input.onDown.add(particleBurst, this);
    
    //This is Clickable text
    textButton = game.add.text(game.world.width - 5, 5, "CLICK ME", fontStyle);
    textButton.anchor.setTo(1, 0);
    textButton.inputEnabled = true;
    
    //This event is fired on click on text event # 2
    textButton.events.onInputDown.add(function () {
        console.log("button is Clicked");
    }, this, 2);
    ...
    

1 个答案:

答案 0 :(得分:9)

您可以添加背景 - 透明精灵 - 并使用input.priorityID

  

priorityID用于确定应该获取哪些游戏对象   输入事件发生时的优先级。例如,如果你有几个   重叠的精灵,默认情况下是显示顶部的精灵   列表优先考虑输入事件。你可以阻止它   通过控制priorityID值发生。值越高,   他们被认为对输入事件越重要。

请参阅:http://docs.phaser.io/InputHandler.js.html#sunlight-1-line-45

// This is event #1 added to background sprite
var bg = game.add.sprite(0, 0);
bg.fixedToCamera = true;
bg.scale.setTo(game.width, game.height);
bg.inputEnabled = true;
bg.input.priorityID = 0; // lower priority
bg.events.onInputDown.add(particleBurst);

确保textButton具有更高的优先级:

textButton.input.priorityID = 1; // higher pirority

将点击的精灵(我们的背景)作为第一个参数添加到粒子函数中:

function particleBurst(bg, pointer) {

这样只会触发一个事件。

查看修改过的小提琴:http://jsfiddle.net/g05bbL6g/3/