Jump to content

[solved] PointUp event and BABYLON.GUI


Recommended Posts

Yesterday i add simple GUI buttons to my game. I have problem with pointer event, when i click to button pointer event send data with selected mesh (I think about ground instead button) and now i logic of my game, if i select ground player move to this point. Is possible to block pointer event when i click to my button?


Link to comment
Share on other sites

Hi TF.

  I think if you set button.isPointerBlocker = true, or stackPanel.isPointerBlocker = true;   ...then you will NOT be able to click ground THROUGH button or stackPanel.

I did tests... https://www.babylonjs-playground.com/#XCPP9Y#149

Stackpanel red, button green.

For ground click tests, watch console.  When ground is clicked, ground.actionManager reports the hit... to console.  I see no ground clicks when red panel or green button are clicked.  Is that what you wanted?  I hope so.  Perhaps I misunderstand.


SimpleButtons are set .isPointerBlocker = true by default, it seems.  So, I don't know why you have click-thru problem. 

StackPanels are set .isPointerBlocker = false by default. If you use stackPanel, try setting it true.  But beware of stackPanel being too wide... blocking ground clicks in bad places.  You might need to set stackpanel.width == button.width.  Dunno... I'm still learning.

I report button and panel to console, where you can click on the word Object and launch browser object inspector.  Then, it is easy to see all properties on button and panel.

In this PG, onPointerEnter and onPointerOut observables are attached to PANEL, and not to button (see lines 53-58).  Wingnut playing/experimenting. 

(I had trouble raising Y position [.top] of button, but then I raised Y position of stackPanel, and that worked.)  For fun, notice that stackPanel width == fullscreen width, by default.

Anyway, experiment with .isPointerBlocker on buttons/stacks, and see if that solves your issue.  Also, ground.isPickable = true/false might be useful. OnEnter button/panel... ground.isPickable = false;  OnOut button/panel... ground.isPickable = true;  *shrug*  I hope I am on-topic.  Be well.

Link to comment
Share on other sites

I tested this flag in my project -> babylon.furcatomasz.pl, but without positive results. In PG it works fine... Later i will check setting my pointer events in other positions of my project, maybe this is problem, maybe imported scene - i don't know I must check it. Thanks for show good way to resolve this problem.

Link to comment
Share on other sites

After many tests i do not know why isPointerBlocker not work.

So your tip about register function onEnter and onOut is perfect.

Now my code, makes my game GUI more user friendly :) 

            let self = this;
            control.onPointerEnterObservable.add(function() {
                self.game.sceneManager.environment.ground.isPickable = false;

            control.onPointerOutObservable.add(function() {
                self.game.sceneManager.environment.ground.isPickable = true;

Additionally I used your code from PG and it don't work too.

Thanks @Wingnut

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...