Как да спра балончето за събития в easljs?

Имам слушател на събития 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);

javascript canvas html5-canvas easeljs
person Tom    schedule 10.10.2013    source източник

Отговори (4)


arrow_upward
4
arrow_downward

Събитието 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");
    }
});
person Lanny    schedule 10.10.2013

arrow_upward
0
arrow_downward

това е един от начините за премахване на фигурния обект в сцената.

stage.removeChild(shape);

можете да поставите това във функция и просто да я извикате, когато искате да премахнете обекта.

моля, уведомете ме, ако това е, от което се нуждаете.

person Mox    schedule 10.10.2013
comment
Изглежда не си разбрал какво имам предвид. - person Tom; 10.10.2013

arrow_upward
0
arrow_downward

Може би има по-добър начин, но можете да проверите дали няма обект под мишката, когато хванете събитието "stagemousedown":

function mouseDown(event) {
    if (stage.getObjectUnderPoint(event.stageX,event.stageY) == null) {
        // ...
    }
}
person Mister D.    schedule 10.10.2013
comment
Тази идея изглежда добра. Но натискането на мишката върху hitArea също получава stage.getObjectUnderPoint(e.stageX,e.stageY) == null. - person Tom; 10.10.2013
comment
Опитах тук: jsfiddle.net/f6TzD/7. Зададох hitArea, по-голяма от моя обект, който хваща събитието на мишката. И изглежда, че обектът все още се разпознава, където и да щракна върху hitArea. - person Mister D.; 10.10.2013
comment
Открих проблема. Когато използвате най-новия createjs или easeljs, той няма да работи правилно. Но когато използвате createjs в jsfiddle, той работи добре. - person Tom; 11.10.2013
comment
Тогава може да имам сложно решение. Към всички обекти, които не са добавени към сцената, можете да добавите прослушвателите на събитията mouseover и mouseout, където задавате булева стойност на true/false. Тогава условието във вашата функция mouseDown ще бъде stage.getObjectUnderPoint(e.stageX,e.stageY) == null && !yourBool - person Mister D.; 11.10.2013

arrow_upward
0
arrow_downward

Мисля, че това, което търсите, е stage.mouseEnabled = false:

Показва дали да се включи този обект при изпълнение на взаимодействия с мишката. Задаването на това на false за деца на контейнер ще накара събитията в контейнера да не се активират, когато се щракне върху това дете. Задаването на това свойство на false не пречи на метода getObjectsUnderPoint да върне детето.

От документи обаче:

Забележка: В EaselJS 0.7.0 свойството mouseEnabled няма да работи правилно с вложени контейнери. Моля, проверете най-новата версия NEXT в GitHub за актуализирана версия с разрешен този проблем. Корекцията ще бъде предоставена в следващото издание на EaselJS.

person aaronjbaptiste    schedule 17.12.2013