Hi
I am using Phaser 3 (great framework!)
On button click - a dialog box is shown
The dialog bog is a container with some graphics objects on it.
(*) When the dialog box (the container) is shown, I would like the background, which still show the other game objects, to be in black and white and not active.
(*) Also, when the player clicks outside the dialog box, I would like to close (destroy) the dialog box.
What is the best way to do it?
Thanks for any help. alon
It’s best to use a separate scene for UIs. This makes it easier to separate your code and you’ll be able to pause everything behind using the normal scene lifespan.
Making a scene black and white is harder and there’s nothing built in for it. For the Canvas Renderer, I can’t think of a simpler way than taking a snapshot, converting it to black and white manually, then adding it as a texture. With WebGL, you can use a custom shader applied to the whole camera.
You can put a Zone object that takes up the entire canvas behind your dialog, then close the dialog when it’s clicked.
Thanks for your quick reply!
How do I convert a snapshot to black and white?
That’s a really nice shader. It looks like you should be able to attach it directly to a camera.
Without WebGL, you’d have to get the pixel data of the snapshot (e.g. by drawing it to a separate canvas and using getImageData), then apply a grayscale algorithm to it.