Prevent meshes covered by GUI from being picked

Heya, I’m wondering if anyone knows a way to prevent meshes which are covered by the GUI from being picked (specifically from being selected by the GizmoManager)?

For instance here is a playground with the right-most 30% of the canvas covered by a GUI panel.

Any ideas on how to prevent the sphere meshes on that 30% of the canvas from being selected by the GizmoManager?

PS, I mean for whichever meshes are on the right-most 30% of the canvas at any given time to be un-selectable, since the user can transform the meshes and camera. :slightly_smiling_face:

Edit, I’m hoping there’s some way to tell the scene not to pick anything on that part of the canvas, but IDK if that’s the right approach or where to start… :thinking:

Well I got something working, using the mesh’s onAfterWorldMatrixUpdateObservable to check if the projected x position (of the mesh’s boundingBox.minimumWorld) is on the right-most 30% of the canvas or not and then updating the GizmoManager’s attachableMeshes array accordingly. And also checking every mesh when the camera’s view or projection matrix is transformed.

So now only the meshes that are at least partially uncovered by the GUI panel are selectable. :slightly_smiling_face:

IDK if it’s the most performant way to do it thou, because it’s an awful lot of projecting. :thinking:

https://playground.babylonjs.com/#IU6YLC#4

If you populate the GUI stackpanel with buttons (maybe transparent button with 100% width and height) they will prevent mesh from being picked, at least it is so in the Inspector - try to pick any mesh between Top and Bottom buttons: https://playground.babylonjs.com/#XCPP9Y#9455

2 Likes

Awesome, that’s just what I was looking for, and much faster and easier then any approaches I was thinking of… Thanks! :beers: :smile:

https://playground.babylonjs.com/#IU6YLC#5

PS, one transparent button the size of the panel did the trick! :+1:
https://gui.babylonjs.com/#4GEK8A

1 Like

Other option:

advancedTexture.getControlByName("StackPanel").isPointerBlocker = true;
4 Likes

Thanks @Deltakosh, that’s a wonderful, simple solution! :slightly_smiling_face: :beers:

1 Like