Inputs available on masked image

Phaser 3
1

Hello guys! I hope you are doing well!. I’m facing an issue at the moment about my game.

I’m currently working on the tutorial part and I would like to add an image with a mask. For that part, everything is working fine, I add a square which take all the screen dimension, tinted it in black and reduce a bit it’s alpha to create an overlay. I also add a mask (inverted alpha) on the overlay based on another image.

The issue that I’m facing is that I would like to block any inputs outside the mask. The goal is to obligate the player to click on the section which is not hided by the overlay. Is there a way to achieve that?

Thanks!

2

Hi. You’ll have to filter the input yourself, or you could add some dummy interactive zones to cover those areas.

3

Hmm… ok.

I thought there would be a way to detect the inputs inside the mask. It would be quite cleaner but thanks!

4

If it’s a bitmap mask you could make it interactive with the pixel-perfect hit test, that might get you somewhere, but I’m not sure.