jpdev

babylon GUI - missing button event "click"

Recommended Posts

Hi,

I am using the great babylon gui for my latest project - just some simple buttons for level select so far.

I noticed that there is no event that functions exactly as a button "click" event should behave.

There are up and down events, but they don't quite hit the mark for the event that should trigger when you "click" a button.

Most GUI trigger a button on the "up" event, but only if the cursor is still over the element.
(Try it with any button element for example in the post editor of this forum, or any windows button - if you press the mouse button down but only release after moving the mouse outside of the element, it won't trigger)

So my fix so far is (pure js):

button.onPointerUpObservable.add(
  function() {
    if (this.btn._enterCount === 0) {
      return;
    }
    //Do "click" stuff
  }.bind({btn: button})
);

But this accesses a private variable (_enterCount).

So I think there should either be a getter function to access _enterCount or there should be a onPointerClickObservable.

Any thoughts?

Share this post


Link to post
Share on other sites

Hiya JPdev... good to see you again.  I don't know if we can expect that BabylonJS GUI would be as power-fleshed as DOM form controls.  DOM events have had 100,000 developers and 20 years of time.  BabylonJS GUI has had, primarily, one developer and about 1.5 years of growth-time.  :) 

Still, I know what you are saying, and you make an interesting and pertinent point.  Your idea/need is potentially a fine BJS GUI feature request/idea, in my opinion.  @Deltakosh and others will want to see this use-case/issue.  

Meantime, I decided to go experimenting:   https://www.babylonjs-playground.com/#XCPP9Y#431

Surely a bad approach (I'm famous for my bad approaches.  I code JS... like an infant uses industrial power tools.  heh.)

Lines 36-38... my onClick eventHandler.  It only dumps the clicked control to console.

Line 47... I overloaded the button object... by adding my own button.isPointerOver = false;

That new property is used as a filter/discriminator in the UP observer... lines 54/55.

That property is toggled in the ENTER and OUT observers... lines 60 and 64.

I think this playground demo is "acting" with your wanted-functionality.  Be sure to correct me if I am wrong about that.

But, I needed to take "the long trail" to get here, didn't I?  *nod*  hmm.  This is an interesting topic, for sure.

Anyway, we have a playground demo to do tests-upon.   Likely, smarter people than I... will have more/better ideas and will comment soon.  Stay tuned.

Share this post


Link to post
Share on other sites

Hi @Deltakosh & @Wingnut thanks for the replys.

I found this definition that matches what I experience with buttons across all software (web & desktop):

Quote

The click event is fired when a pointing device button (usually a mouse's primary button) is pressed and released on a single element.

(from https://developer.mozilla.org/en-US/docs/Web/Events/click)

My code from the first posting (checking the enterCount) does achieve that.

If you agree that the event should fire when "Up" is fired and the cursor is still over the button, and that the enterCount check is the way to go, I'll try and create a pull request on github.

 

 

Share this post


Link to post
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.

Guest
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.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.