Rectangle not capturing events

Phaser 3
1

I’ve created a rectangle as follows:

let r = scene.add.rectangle(W/2, H/2, W, H, 0x000000, 100);

The rectangle is on top of all my other objects (for which drag is enabled), but when I click on underlying objects the callbacks for their drag events are called. I was expecting that the object on top would prevent the propagation to those below. I tried adding callbacks for the events to the rectangle itself, and
I found somewhere that callbacks should be passed pointer, x, y, event, and on the event one can call stopPropagation(), but in my case I’m getting undefined as fourth parameter.

How do I create a rectangle on top of other scene objects which prevents the underlying objects to be interactive?

2

Maybe you need to call setTopOnly (https://photonstorm.github.io/phaser3-docs/Phaser.Input.InputPlugin.html#setTopOnly) to make sure the only top render that will fire the event.
And ofcourse that rectangle need to be rect.setInteractive() first.

3

uhm… setTopOnly would apply to everything. I have multiple images already on the screen, and for those when I click on one, only the one at the top emits the event already. I wonder how to achieve the same semantic with a rectangle.

4

Are you tried that setTopOnly method? It doesn’t work?