Events on GUI (onPointerClickObservable not returning "expected" object)

Questions
1

Hi.
It’s me again with the GUI menu I am creating. This time my issue is this.

https://www.babylonjs-playground.com/#XCPP9Y#1092

In the example above you can see three different observers.

  • onPointerEnter (returns object that is entered/hovered over, which is what I need);
  • onPointerOut (returns the same thing as previous one);
  • onPointerClick (doesn’t return the object that I clicked on, I believe it returns the coordinates where I clicked and buttonIndex);

What I need is to get GUI control that I clicked on, so the same thing as first two observers return. Am I doing this wrong, is there another way?

2

Hi nogalo,

I do agree that’s a bit confusing, but according to the documentation that seems to be how it’s supposed to work. You can get around it by just caching the information you need from the enter and exit events, as you should in theory only be able to click on a button that your cursor entered. Would that work for you?

https://www.babylonjs-playground.com/#XCPP9Y#1094

(NOTE: I’m not exactly sure how this would work with touchscreen devices, where the “cursor” doesn’t necessarily have to “travel” in order to reach UI. If you’re targeting a platform that can have touchscreens, that’s definitely something to double-check.)

1 Like
3

Well, that was my thinking also. That helps for now, as I don’t intend to have this project on the mobile devices just yet. But I believe that eventually I will have similar things that will be on mobile devices, so I will need some better solution.

4

Hi, from looking at the GUI.Control and Observable source code, it seems that you can use the currentTarget property of the EventState:

https://www.babylonjs-playground.com/#XCPP9Y#1095

1 Like
5

Oh thank you @Gijs. I appreciate it. I believe that will do what I need.

Cheers. :slight_smile:

1 Like