[1.12.2] How does the GUI/UI system works?

[TheAwesomeGem]

Is there any guide/tutorial on how the GUI/UI works in Minecraft and Forge? I know you use Containers if you want Inventory, otherwise draw the UI with OpenGL stuff. Is OpenGL the best way to draw GUI/UI? Also how does the positioning works? Is it relative or absolute? Thank you.

[TheAwesomeGem]

So If I were to make a TileEntity based GUI, my only option is a Container right? Since that has information from both server and client(server gives info to client to open the UI and client and talk back to the server when the container changes). Or is there anything else I am missing?

[jabelar]

Containers are convenient if you want to sync data between the client and server, and particularly if there is an inventory. Technically though you can send a custom packet to keep the client up to date and send back interaction information and make a simpler custom GUI. I've done the latter before and it isn't that hard.

[TheAwesomeGem]

2 hours ago, jabelar said:

Containers are convenient if you want to sync data between the client and server, and particularly if there is an inventory. Technically though you can send a custom packet to keep the client up to date and send back interaction information and make a simpler custom GUI. I've done the latter before and it isn't that hard.

Hey I followed your tutorial and learned a lot about GUI drawing and containers. However one part that I don't get is the size and positioning. Are they absolute values in pixels or relative? Also how do I support my UI in different resolution and Gui Size(like Small, Normal or Large)?

[jabelar]

If you look at where GUIs are opened in the Minecraft#displayGuiScreen() method, you'll see that as soon as the current GUI is set to a new GUI (i.e. just opened the GUI) the following code is run:

            ScaledResolution scaledresolution = new ScaledResolution(this);
            int i = scaledresolution.getScaledWidth();
            int j = scaledresolution.getScaledHeight();
            guiScreenIn.setWorldAndResolution(this, i, j);

 

Since that code is running in the Minecraft class, the "this" refers to the entire game window. So you can see that the idea is that the GuiScreen "resolution" is set to be the entire game window. In other words, the GuiScreen always covers the whole window, but it is up to you where you draw your Gui within the game window.

 

If you look at the GuiScreen#setWorldAndResolution() method you'll see that it sets the height and width fields of the GuiScreen.

 

So with all that background you should be able to understand how to scale your Gui. You should leave the height and width fields, but do drawing locations based on them. So if you wanted to draw in the middle of the game window you'd use height/2 and width/2. This will ensure they scale along with the minecraft game window. 

 

Hope that makes sense. Also, just look at other GuiScreen-based classes to understand how they position things.

Edited December 26, 2017 by jabelar