[LibGDX] How to Make Game HUD and UI?

[Rayexar]

Hey,

Basically, I just want a simple on-screen HUD with some text and a few buttons. One of the buttons is meant to bring up a "player inventory" which should just be a grid with items in it.

More specifically, I'm not sure how to render the HUD/UI on the game Screen amd how to handle the input. Can anyone please give some suggestions on how this can be handled?

Thank you very much!

[StumpyStrust]

Look into scene2d in libgdx. A bit of work getting the skins stuff going but once done rather easy. You can use the scene2d stuff just for rendering the UI and do your own stuff for the rest of the game.

[Otreum]

I am just gonna drop this one in here. It is a good series of LibGDX tutorials which include UI stuff.
http://www.youtube.com/playlist?list=PLXY8okVWvwZ0qmqSBhOtqYRjzWtUCWylb

Also this.
http://www.youtube.com/playlist?list=PLXY8okVWvwZ0JOwHiH1TntAdq-UDPnC2L

There are a few other tutorials out there which cover more in depth on how to create your own UI, menu, splash screens, inventory etc etc.

Games published by our own members! Check 'em out!

[Rayexar]

scene2d seems fairly complicated to use, especially for just some basic UIs. Do you think it's easier use scene2d or create the HUD/UI graphics and manually draw and handle input?

[StumpyStrust]

Everything is at first. Setting up the stuff can be a pain, but once that is done, rather smooth. I would not recommend doing it yourself unless you want to learn how. If you want to make games, use apis.

[Nate]

Which part of scene2d is complicated at first? See this:
https://github.com/libgdx/libgdx/blob/master/tests/gdx-tests/src/com/badlogic/gdx/tests/UISimpleTest.java#L43

[Rayexar]

It doesn't seem too difficult now after looking at some examples. It seemed complicated at first because I was overwhelmed at how much information there was on scene2d. Thanks everyone for the links and advice.

[davedes]

The only complicated part of Scene2D is finding the default skins... Which IMHO should be included in LibGDX, like BitmapFont's default font.

[StumpyStrust]

Yes davedes oh God yes.

[Rayexar]

I've been learning scene2d but I don't fully get skins and tablelayout. How would I, for example, create a simple ImageButton and draw it on the screen?

I have a stage, table and skin. I added a texture to the skin like so

1	skin.add("bluebutton", new Texture(Gdx.files.internal("ui/bluebutton.png")), Texture.class);

, but how do I set the position of the ImageButton and draw it on the screen? ImageButton has constructors which take a skin, ImageButtonStyle and drawable, but I'm not sure which one to use?

Games published by our own members! Check 'em out!

[Nate]

davedes, maybe is we get Shiu to create a skin that isn't ass.

Rayexar, any of the constructors are fine. If you have a skin then use a skin constructor. Probably you want to use Button though, not ImageButton.

[Rayexar]

Ok, thanks for that. Now I'm having trouble setting the position of Buttons. button.setPosition(x, y) has no effect, and button.pad(x) also has no effect.

Edit: table.align(int align) allows me to set the alignment, and I found out about table.row(), but that still allow me to more specifically set the position of buttons.

Can someone please explain what button.pad(float x) does? It seems to have no effect, but when i set x to 100, the  button suddenly gets stretched out.

[Rayexar]

Alright, I figured it out. Using a combination of methods like these seems to work:

1   2   3   4

table.add(button).padRight(10).padLeft(10);       table.add(button2);       table.left().bottom();

[Nate]

http://code.google.com/p/table-layout/