unobruno

How to orientate GUI.Slider vertical ?

Recommended Posts

Hiya UB, welcome to the forum.

  I have only made one vertical slider in my life, and I might have done it incorrectly... but here it is.

https://www.babylonjs-playground.com/#3VMTI9#5

I used it for an experimental list-view window...  https://www.babylonjs-playground.com/#08KEYA#32

(Side note:  I might try a re-write of that PG, using the new GUI Grid Control.  Potential reduced code/complexity, and easy-addition of many more table columns.)

@Arte added some mousewheel stuff in lines 311-325, works great... but... #30 is a free-camera scene (doesn't use mousewheel for the camera).  For arc-rotate-camera... mousewheel IS used for the camera... for zoom/cam-distance.

Sooooo... if you are going to activate mousewheeling on your vertical slider, you might wish to use a freeCamera... to avoid mouseWheel conflicts.  It looks like you are over-riding the arcCamera mousewheel-zoom, and using the slider for zooming.  So, maybe no problem for you to use freeCamera, along with Arte's 311-325 mousewheel code.

Advanced stuff:  Mousewheeling vertical sliders... might depend-upon "focus".  Let's pretend you have 4 vertical sliders on-screen.  You need to invent a focus system... so the mousewheel knows WHICH vertical slider to slide.  :) PointerEnterObservable ad pointerOutObservable... are a good way to make a focus system, but I have seen the TAB button used, too... like in web-page forms.  Be sure to ask... if you have troubles with a focus system... we're here for ya.   I don't think anyone has done much GUI control focus/un-focus work... so maybe we will all invent it together (you and other forum members).

Maybe someone already invented a focus system for GUI.  Perhaps they will comment soon.

I hope this helps.  Party on!

Share this post


Link to post
Share on other sites
19 hours ago, Wingnut said:

Hiya UB, welcome to the forum.

  I have only made one vertical slider in my life, and I might have done it incorrectly... but here it is.

https://www.babylonjs-playground.com/#3VMTI9#5

I used it for an experimental list-view window...  https://www.babylonjs-playground.com/#08KEYA#32

(Side note:  I might try a re-write of that PG, using the new GUI Grid Control.  Potential reduced code/complexity, and easy-addition of many more table columns.)

@Arte added some mousewheel stuff in lines 311-325, works great... but... #30 is a free-camera scene (doesn't use mousewheel for the camera).  For arc-rotate-camera... mousewheel IS used for the camera... for zoom/cam-distance.

Sooooo... if you are going to activate mousewheeling on your vertical slider, you might wish to use a freeCamera... to avoid mouseWheel conflicts.  It looks like you are over-riding the arcCamera mousewheel-zoom, and using the slider for zooming.  So, maybe no problem for you to use freeCamera, along with Arte's 311-325 mousewheel code.

Advanced stuff:  Mousewheeling vertical sliders... might depend-upon "focus".  Let's pretend you have 4 vertical sliders on-screen.  You need to invent a focus system... so the mousewheel knows WHICH vertical slider to slide.  :) PointerEnterObservable ad pointerOutObservable... are a good way to make a focus system, but I have seen the TAB button used, too... like in web-page forms.  Be sure to ask... if you have troubles with a focus system... we're here for ya.   I don't think anyone has done much GUI control focus/un-focus work... so maybe we will all invent it together (you and other forum members).

Maybe someone already invented a focus system for GUI.  Perhaps they will comment soon.

I hope this helps.  Party on!

Thx. Thats what i'm searching for

Share this post


Link to post
Share on other sites

Hi guys.  Glad to hear you are rolling, UB.

Perhaps wise to check cross-browser and cross-platform very carefully... for these "bootleg" vertical sliders.

Thx for info, DeltaKush... I/we never knew they were intended for horz-only.  Yes, interesting!

Sometimes, I do the slider rotation, but the mouse still needs dragging left/right... to make slider to move up/down.  Strange.

I think #4 is currently doing that. (same for both IE and FF.)  I should study why.

I'm quite sure the slider control... is haunted.  :)  But it is haunted by a friendly ghost.

Share this post


Link to post
Share on other sites
On 6/9/2018 at 1:45 PM, Wingnut said:

Hi guys.  Glad to hear you are rolling, UB.

Perhaps wise to check cross-browser and cross-platform very carefully... for these "bootleg" vertical sliders.

Thx for info, DeltaKush... I/we never knew they were intended for horz-only.  Yes, interesting!

Sometimes, I do the slider rotation, but the mouse still needs dragging left/right... to make slider to move up/down.  Strange.

I think #4 is currently doing that. (same for both IE and FF.)  I should study why.

I'm quite sure the slider control... is haunted.  :)  But it is haunted by a friendly ghost.

i just used jQuery UI. Might be a better solution for now

Share this post


Link to post
Share on other sites

Sure... could be so.  One issue... VR head gear.  Last I heard... VR head gear does NOT allow HTML elements to be on-canvas.

I don't have any VR headsets, nor have I gotten the opportunity to try it... but... I hear it's becoming popular.

This is why some of us prefer BJS GUI (2d and 3d).  Ok, party on!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.