Sign in to follow this  
swansong

GUI overlay

Recommended Posts

I am planning on making a game with a doom style HUD, this requires me to put a GUI image component at the bottom of the screen. I have this part working correctly, but now I would like to put GUI text components ON TOP of the image. When I try to put these elements at the bottom of the screen they do not move from the middle of the screen. Is there a way I would be able to make an  overlay that goes ontop of a GUI element?

Share this post


Link to post
Share on other sites

@swansong-

I would consider using a separate canvas on top of my render canvas, as this will make your life much easier. Otherwise, you can run into all sorts of problems trying to manage your GUI elements on a render canvas. As I often comment, I highly advise avoiding GUI extensions and take advantage of the standard HTML canvas and CSS styling to avoid sharing your render canvas with GUI elements that often cause artifacts and many other problems. Some people might recommend GUI extensions for beginners, however HTML canvas and CSS is so very simple to master that it's never worth going down the road of limiting your UI to whatever the developer of the extension had time to implement. There are few limitations to styling yourself from scratch, and far more advantages and immense power with few limitations once you begin building yourself. And this then allows you to animate whatever you like and/or use widgets in coordination with your HTML canvas elements as well as JavaScript to create rich GUIs and animated canvas elements for any user experience you can imagine. 

I learned the hard way that I spent far more time trying to code a less rich UE using GUI extensions, where in less time I can create a rich User Experience as it's so very simple, flexible, and efficient building my UIs from scratch through HTML and CSS.

DB

Share this post


Link to post
Share on other sites
BABYLON.GUI.Button.CreateImageWithCenterTextButton();
was created just for that :) 

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

i just notised it isn't on the doc's page anymore, must have been overwritten..
but you can generally find anything GUI related at http://doc.babylonjs.com/how_to/gui

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...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.