1

我在舞台上有一个 mousedown 事件侦听器，在一个形状上有一个 mousedown 事件侦听器。当我单击形状时，舞台上的 mousedown 事件侦听器也会触发吗？如何解决这个问题？

var stage = new createjs.Stage("test");
stage.addEventListener('stagemousedown',mouseDown);
var shape = new createjs.Shape();
shape.graphics.beginStroke("#000").setStrokeStyle(8,"round").drawRect(0, 0, 100, 100);
shape.addEventListener('mousedown',smouseDown);
stage.addChild(shape);
4

4 回答 4

4

stagemousedown 事件是一个特殊事件，它始终捕获舞台鼠标交互，无论单击什么。如果您只想在未点击舞台上的孩子时收到该事件，还有其他方法。

一个建议是添加一个与舞台大小相同的舞台级子级，并在其上监听鼠标事件。然后，您可以检查目标以查看单击（或未单击）的内容

var stage = new createjs.Stage("canvas");

var bg = new createjs.Shape();
bg.graphics.f("#ddd").dr(0,0,550,400);

var shape = new createjs.Shape().set({x:200,y:200});
shape.graphics.f("#f00").dc(0,0,100);

stage.addChild(bg, shape);
stage.update();

stage.addEventListener("mousedown", function(event){
    if (event.target == bg) {
        console.log("Missed Content");
    } else {
        console.log("Hit Content");
    }
});
于 2013-10-10T15:26:16.350 回答
0

这是移除舞台中形状对象的方法之一。

stage.removeChild(shape);

你可以把它放在一个函数中，当你想删除对象时调用它。

请让我知道这是否是您需要的。

于 2013-10-10T06:53:35.180 回答
0

也许有更好的方法，但是当你捕捉到“stagemousedown”事件时，你可以检查鼠标下是否没有物体：

function mouseDown(event) {
    if (stage.getObjectUnderPoint(event.stageX,event.stageY) == null) {
        // ...
    }
}
于 2013-10-10T07:39:29.773 回答
0

我认为您正在寻找的是stage.mouseEnabled = false：

指示在运行鼠标交互时是否包含此对象。将 Container 的子项设置为 false 将导致 Container 上的事件在单击该子项时不会触发。将此属性设置为 false 不会阻止 getObjectsUnderPoint 方法返回子项。

但是，从文档：

注意：在 EaselJS 0.7.0 中，mouseEnabled 属性将无法与嵌套容器一起正常工作。请查看 GitHub 中最新的 NEXT 版本以获取已解决此问题的更新版本。该修复将在 EaselJS 的下一个版本中提供。

于 2013-12-17T16:41:59.063 回答