java - Default Skin LibGDX?

Question

I've been following this: https://code.google.com/p/table-layout/#Quickstart to get a little introduction to tables in LibGDX. I already experimented around a little with buttons.

Now I have this code:

Label introLabel = new Label("Skip Intro", skin);
TextField introText = new TextField("", skin);

table.add(introLabel);
table.add(introText).width(100);
table.row();

But it throws a NullPointerException because: No com.badlogic.gdx.scenes.scene2d.ui.Label$LabelStyle registered with name: default

I only added my buttons (from somewhere else in the screen) into the skin:

atlas = new TextureAtlas("assets/gui/buttons/alpha_generic_buttons.pack");

skin = new Skin();
skin.addRegions(atlas);

My question would now be what kind of textures a table needs and most of all, how do I use them with the table?

Answer 1

When it comes to UI in libGDX, you will find its very different than what you would have used before (yaml, json, xml, UI Builders, etc).

Table Layout - This is how Scene2d UI is structured and formatted. The link you have provided is a great tutorial, but as you have come to realize, you need a skin to do most things.

LibGDX Skin - consists of 3 things, a texture pack image, a texture pack file, and a Json to set up the styles. You can also generate them programmatically like you are doing, but I find it much easier to simply load them from a file and use. If you want to learn more about how to make skins, or edit them, etc follow this link: Skins.

Now, back to the exception you are getting. This is because the skin you have created doesn't have the json used to describe the styles for various UI elements. In the case of the above exception, the label inside of the text field doesn't have a default style.

What you can simply do is use the template provided in the tests folder:

1. Atlaspack File
2. Json File
3. Atlaspack Image
4. Font Image
5. Font File

Put these files in the assets folder of your android project. And then you can easily load this skin with one line of code:

Skin uiSkin = new Skin(Gdx.files.internal("uiskin.json"));

This will have the missing piece of information to make your TextField object, as well as a bunch of other default styles:

com.badlogic.gdx.scenes.scene2d.ui.Label$LabelStyle: {
    default: { font: default-font, fontColor: white },
}

Hopefully this helps get you started. There are a number of other little things so don't be afraid to look over the Scene2d.UI article on the wiki for more information.

Note: You can use gdx-tools artifact to be able to use the default UI skin out-of-the-box (can be quite useful for very small/simple applications, for debugging, when you're in a real rush to have the UI visible, etc).