简体   繁体   English

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

[英]Phaser JS how to stop event Propagation(firing) from textButton.events.onInputDown event to game.input.onDown event?

Here is the JSFiddle . 这是JSFiddle

I have two events here. 我这里有两件事。

  1. Is game.input.onDown which does some logic (generates particles in my example) game.input.onDown做了一些逻辑(在我的例子中生成粒子)
  2. Is textButton.events.onInputDown , where textButton is a Phaser.Text object instance, which does another logic. textButton.events.onInputDown ,其中textButton是Phaser.Text对象实例,它执行另一个逻辑。

The problem is: when I click on my textButton both event are fired 1 and 2 . 问题是:当我点击我的textButton时,两个事件都被触发12

The question is, how to prevent event 1 from firing when I click on the textButton ? 问题是,当我点击textButton时如何防止事件1被触发?

Part of code: 部分代码:

...
//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);
...

You can add a background - transparent sprite - and use input.priorityID . 您可以添加背景 - 透明精灵 - 并使用input.priorityID

The priorityID is used to determine which game objects should get priority when input events occur. priorityID用于确定在输入事件发生时哪些游戏对象应获得优先级。 For example if you have several Sprites that overlap, by default the one at the top of the display list is given priority for input events. 例如,如果您有多个重叠的Sprite,默认情况下,显示列表顶部的Sprite为输入事件赋予优先级。 You can stop this from happening by controlling the priorityID value. 您可以通过控制priorityID值来阻止这种情况发生。 The higher the value, the more important they are considered to the Input events. 值越高,它们对Input事件的考虑就越重要。

See: http://docs.phaser.io/InputHandler.js.html#sunlight-1-line-45 请参阅: 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);

Make sure your textButton has higher priority: 确保textButton具有更高的优先级:

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

Add the clicked sprite (our background) as a first parameter to the particle function: 将点击的精灵(我们的背景)作为第一个参数添加到粒子函数:

function particleBurst(bg, pointer) {

This way only one event should be triggered. 这样只应触发一个事件。

Check out modified fiddle: http://jsfiddle.net/g05bbL6g/3/ 看看修改过的小提琴: http//jsfiddle.net/g05bbL6g/3/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM