Behavior when button up outside the button

Hello.
I want to prevent the button click from working when the button is clicked and dragged while it is pressed to move the cursor out of the button and then release the button.
Any way?
Thank you

Hello! You can use onPointerEnter and onPointerOut to detect when the cursor is inside/outside the button: Click only if inside button | Babylon.js Playground (babylonjs.com)

1 Like

Yes well, I believe there’s another solution for this.

Rely on pointerDown and Up observables. On the pointerDown, initiate the action and next make your button a pointerBlocker. Next, onPointerUp reinstate 'isPointerBlocker = false". This way, you can make sure that whilst you are holding the mouseclick after ‘pointerDown’ no other events will pass to your button until you release it.

Edit: I guess I forgot some details. Below a PG demonstrating how this can work with a button or a rectangle+textBlock. Notice that the button still lets the pointerUp event through where the rebuild from
a rectangle with a textBlock acting as a pointerBlocker doesn’t. Which might be better but also means that you have to observe the pointerUp at scene level (because it won’t trigger from the button). Hope this helps.

2 Likes

The example source is very useful for me.
Thank you!!!

1 Like

Thanks for taking the time to explain in detail.
It helped me a lot in getting to know Babylonjs.
Thank you.!!!

1 Like