Hello again everyone - I have been trying out some things as well as looking for the last couple of hours through forums and playgrounds for a way to align three elements of a UI horizontally in a row - but which is placed in a bottom right hand corner - and for it to remain responsive.
I’ve tried UV Offset - but I feel it may not turn out so well on a range of devices.
I’m wondering is it possible for a stack panel to be used inside another stack panel.
The first stack panel would have the .isVertical = false - then I would align using the second one.
I tried this but no joy but wondering has anyone here found a work around?
Try clicking the little pouch to open and close it. Then try clicking on the light blue cubes with either the pouch open or closed. With the pouch open, click the items you have added they will disappear. So all kinds of interactivity. The pouch panels are parented to the camera so you can move around if you like.
And the pouch panels can be set up where you like
Not sure if that is what you are after as it does not use the UI system. I tend to use my own simple code for such stuff. Maybe the more skilled coders can offer a solution more to your liking.
Basically, you have an outer panel that holds your original panel. The outer one puts the button row on the bottom and your original one pushes everything to the right. I did change a couple of things in the example (eg. stackPanel.width to stackPanel.height) and add some pop-ups to the buttons for testing purposes. Was this the kind of look that you were going for?
Hello @gryff gryff - that looks lovely - well done! I’m impressed you made that up yourself.
Perhaps that’s me in the future.
@PolygonalSun you have done it and taught me something new. I applaud you. And really thank you all for answering my questions. I’m still learning as I go. If there is ever a babylon js meet up I owe people a pint.
Hi Mark. Well, you’ve seen a mesh/sprites/actionManager-based menu, and a BJS GUI stackpanel menu, so you might as well see an HTML-based position: absolute menu, too.
Last I heard… in VR mode… you know… with Occulus head-gear and similar…display of html menus atop a canvas (like seen in the above playground)… is not allowed. But still… in certain situations… HTML menus work (although lots of in-scene code is needed to create them, dynamically).
Also, they have been known to get out-of-position when canvas size/position is user-changed, and when screen size… is user-changed.
Try to use percentages in CSS top and CSS left settings… and not hard-coded “px” values. In that PG, I used a “px” setting for top in line 38, and a percentage setting for left in line 39. Party on!
