Multiple scenes, one interface

It’s a bit simplistic, but the point is the same. Playground.
Two identical scenes and a different object in each. Create gui. If we bind it to scene1, then the mouse events will still affect scene2 (press the mouse button and move). If we bind to scene2, they will affect scene1. Question. How can we configure our interface so that it does not skip events as it should, regardless of how many scenes there are?

Hello and welcome to the Babylon community!

Do you want the camera on both scenes to move when you click the button? Or neither camera to move?

For the first case, you can set button.isPointerBlocker to false so that the GUI button lets the event go through to the camera: Multiple scenes, one interface. | Babylon.js Playground (babylonjs.com)

For the second case, you can detach the controls on the first camera when the button is pressed, and attach them again when the button stops being pressed: Multiple scenes, one interface. | Babylon.js Playground (babylonjs.com)

2 Likes

Hello!

Yes, that’s the second case. I’ve recently started working with the engine, and I’m reading the documentation. I thought I might have missed something somewhere. Was hoping there was some sort of flag to solve the problem, as in the first case. Just

GUI.isPointerBlocker = true

or something like that. Thank you for your reply! I will use event handlers.

1 Like

In continuation of the theme and the problem. In my case a lot of GUI elements, many are created asynchronously upon the occurrence of certain events. Assigning a handler to each one is a bit boring. As an option, maybe someone else will find it useful (couldn’t find a better one):

myGUI.onControlPickedObservable.add(e => {
        if (e.name != "root") {
            camera1.detachControl();
            e.onPointerUpObservable.addOnce(() => camera1.attachControl(canvas, true));
        }
    });

Playground

3 Likes