Pixi.js: Неинтерактивные спрайты блокируют щелчок интерактивных спрайтов (и DOM больше не блокирует наведение указателя мыши на холст)?

Созданный на 26 апр. 2015  ·  23Комментарии  ·  Источник: pixijs/pixi.js

Надеюсь, эти двое достаточно близки, чтобы соответствовать одной и той же проблеме. Я использую pixi v3

а.) Каждый раз, когда у меня есть два перекрывающихся спрайта, даже если у верхнего спрайта есть interactive = false, мой наведение курсора на нижний спрайт (с Interactive = true) блокируется первым рассматриваемым спрайтом.

б.) При наведении указателя мыши на некоторые элементы DOM, которые я использую для HUD нашей игры, спрайты под ним по-прежнему действуют так, как если бы они были непосредственно наведены. В версии 2 этого не происходило. Это происходит при наведении курсора мыши, но не при щелчке.

Я искал ссылку cdn для v3, чтобы попытаться создать jsfiddle для них, но мне не повезло.

🕷 Bug

Самый полезный комментарий

Хитрость заключается в установке пустого hitArea для DisplayObject или DisplayObjectContainer:
mouseDisabledElement.hitArea = новый PIXI.Rectangle (0, 0, 0, 0);

Все 23 Комментарий

https://rawgit.com/

Довольно круто. Вы можете просто вставить туда ссылку на файл dev bin, и он предоставит вам URL-адрес, по которому прокси загружает его прямо с GitHub.

Например, вы можете вставить:

https://github.com/GoodBoyDigital/pixi.js/blob/dev/bin/pixi.js

и вылезай:

https://rawgit.com/GoodBoyDigital/pixi.js/dev/bin/pixi.js

Спасибо, я сделаю несколько примеров jsfiddle сегодня и опубликую их здесь.

У меня проблемы с правильной настройкой jsfiddle, так как я думаю, мне нужно использовать изображение, чтобы проиллюстрировать мою точку зрения, но, надеюсь, я могу просто дать вам код и наблюдения, которые я сделал, чтобы выяснить, что происходит .

Случай теоретической ошибки (фрагмент псевдокода):

var bunny = PIXI.Sprite.fromFrame(building.image); 
bunny.interactive = true;
stage.addChild(bunny);
bunny.hitArea = poly;
bunny.on('mouseover',function(data){
      bunny.brighten
});
bunny.on('mouseout',function(data){
      bunny.unbrighten
});
var g2 = new PIXI.Graphics();
    g2.beginFill(0xC03302);
    g2.drawCircle(0, 0, 100);
    g2.endFill(); 
    var cant_touch_this = new PIXI.Sprite(g2.generateTexture());
    cant_touch_this.position.x = bunny.position.x - 100;
    cant_touch_this.position.y = bunny.sprite.position.y - 100;
stage.addChild(cant_touch_this);

Два спрайта накладываются друг на друга, обработчики кролика перестают работать со вторым спрайтом.

Когда я делаю то же самое в jsfiddle (http://jsfiddle.net/h63mLx7b/), ошибки нет. Одно из основных различий здесь, которое я вижу, заключается в том, что в скрипке я не использую fromImage или fromFrame, а генерирую текстуру. Я пробовал это в контексте моей игры (с использованием двух сгенерированных текстур), и ошибка все еще присутствует.

Следующее, что я думаю как возможный, - это hitArea, но когда я добавил hitArea в jsfiddle, он не воссоздал ошибку. Я собираюсь продолжить обработку своего кода, чтобы увидеть, есть ли какие-либо другие важные фрагменты, которые я пропустил, но, может быть, вы видите что-то, чего мне не хватает? Есть ли в PIXI что-нибудь, что имеет предполагаемое поведение, заключающееся в том, чтобы спрайт предотвращал события ниже его, что я мог случайно включить?

Возможно также полезная информация, у кролика есть

    bunny.pivot.x = 0.5;
    bunny.pivot.y = 1;
    bunny.anchor.x = 0.5;
    bunny.anchor.y = 1;

Еще один полезный лакомый кусочек: в контексте моей игры код jsfiddle воссоздает ошибку! Итак, я предполагаю, что последний вопрос: какая глобальная опция (или опция самих контейнеров) может создавать это?

wahooooooo Я разобрался! Это может быть немного лучшими новостями для меня, чем для вас, если предположить, что это действительно ошибка, а не предполагаемое поведение.

http://jsfiddle.net/h63mLx7b/1/

Когда спрайты существуют в контейнере с Interactive = true, возникает ошибка. Если вы установите stage.interactive = false, ошибка исчезнет.

РЕДАКТИРОВАТЬ: сначала неправильная ссылка на скрипку

@englercj ping. просто любопытно, есть ли у вас возможность взглянуть на это

Я еще не знал, извини, Тень.

У меня сейчас происходит много жизненных событий, и у меня не было много времени на побочные проекты. Я надеюсь скоро исправить ошибку, но сейчас очень занят :(

не волнуйся чувак, я понимаю, как это происходит :)

Привет, пипс - сделал небольшую настройку в ветке dev, как это:

http://jsfiddle.net/g3vcfmef/

Теперь все в порядке!
Спасибо :)

Подтвердил, что работает и на моей стороне. Огромное спасибо!

Собственно, вторая часть моего первоначального вопроса все еще вызывает проблему:

б) При наведении указателя мыши на некоторые элементы DOM, которые я использую для HUD нашей игры, спрайты под ним по-прежнему действуют так, как если бы они были непосредственно наведены / нажаты. В версии 2 этого не происходило. Это происходит при наведении курсора мыши, но не при щелчке.

Это вызывает небольшую проблему, поскольку, когда я пытаюсь щелкнуть один из элементов HUD DOM, холст ниже по-прежнему вызывает щелчок, и происходит мой основной обработчик мыши контейнера, тем самым скрывая меню сразу после его создания / отображения. Я попытался использовать e.stopPropagation в обработчике мыши jquery, но безрезультатно.

stage.on('mouseup',function(data){
console.log("Still triggering");
});

$('body').on('mouseup','#battle-menu:not(.attack-island)',function(e){
e.stopPropagation();
});

боевое меню перекрывает этап.

Извините, что снова открываю это, я должен был перечитать свой исходный пост :(

http://jsfiddle.net/prg9jubt/2/

Это странно, потому что иногда срабатывает щелчок по сцене, а иногда нет. Просто нажмите вокруг, чтобы увидеть

Если это вообще помогает, такое поведение, кажется, происходит только для mouseup. Mousedown и щелчок кажутся твердыми.

Отменено в 5344062ef4657857ce6a20bea4681e5d66c1c2b2 для # 1765. Мы ищем лучший способ решить эти проблемы.

@englercj Итак, чтобы убедиться, что я следую, ошибка перекрывающегося спрайта, о которой я упоминал, снова существует в основной ветке pixi, а вы все ищите способ исправить это лучше?

Просто хочу убедиться, что я знаю, где я нахожусь / могу ли я просто уйти от этого сейчас, чтобы поработать над другими вещами

Да, это правильно.

Хорошо, спасибо за обновление @englercj

фиксированный! : +1:

Какой сценарий был исправлен? Если мой контейнер interactive = true, а эмиттер частиц блокирует просмотр интерактивного спрайта, события мыши для этого спрайта по-прежнему не срабатывают. Очевидно, что если я установил для контейнера interactive = false, события сработают. Однако я требую, чтобы контейнер был интерактивным, чтобы карту можно было перетаскивать и масштабировать. Я использую последнюю версию кода для разработчиков.

Хитрость заключается в установке пустого hitArea для DisplayObject или DisplayObjectContainer:
mouseDisabledElement.hitArea = новый PIXI.Rectangle (0, 0, 0, 0);

Этот поток был автоматически заблокирован, так как после его закрытия в последнее время не было никаких действий. Пожалуйста, откройте новую проблему для связанных ошибок.

Была ли эта страница полезной?
0 / 5 - 0 рейтинги