jsonbuttonlibgdxpackatlas

Libgdx Missing LabelStyle font for ImageTextButton


I've been creating Button(s) just using the Button class, but figured I'd try the ImageTextButton. However, even with just the Button class, I'm not quite following the docs on how a .pack (atlas) file with a .json file should be working together.

Using the Button class, I can 'name' my button whatever I like in code, and have it named in the json accordingly (see examples below), but for 'Image's, I have to 'name' everything the same, from the construction in code, through the pack and json files. Example of what works:

code:

// note the 'Constants' just point to the json and atlas files, respectively.
skinShops = new Skin(Gdx.files.internal(Constants.SKIN_SHOPS), new
TextureAtlas(Constants.TEXTURE_ATLAS_SHOPS));
// for this next line, note the json definition for Button$ButtonStyle:
Button buttonBuy = new Button(skinShops, "Button-Buy");
// for Images, it seems I cannot have a 'unique' name first, then the drawable name, which I thought refers to the json
Image imgItemsBackground = new Image(skinShops, "shop-items-background");

If you look at the 'scene2d.ui.Image:' definitions, everything is named the same. While its working this way, I'm not clear why.

This could be 2 questions I guess, the previous concern about nomenclature of naming between all these elements, but my current issue I cannot get past is trying to construct an ImageTextButton. In code, I'm building them dynamically depending on where the player is: different shops have different items to sell, and those are read into the items[] array.

ImageTextButton buttonPurchase = new ImageTextButton(items[j], skinShops, "shop_item-button-background");

Stack trace:

Exception in thread "LWJGL Application" java.lang.IllegalArgumentException: Missing LabelStyle font.
at com.badlogic.gdx.scenes.scene2d.ui.Label.setStyle(Label.java:78)
at com.badlogic.gdx.scenes.scene2d.ui.Label.<init>(Label.java:72)
at com.badlogic.gdx.scenes.scene2d.ui.ImageTextButton.<init>(ImageTextButton.java:57)
at com.badlogic.gdx.scenes.scene2d.ui.ImageTextButton.<init>(ImageTextButton.java:44)
at com.uv.screen.InteriorScreen.buildItemButtons(InteriorScreen.java:134)

Where should I be creating / setting the font for these buttons?

json file:

{
com.badlogic.gdx.scenes.scene2d.ui.Button$ButtonStyle: {
Button-Exit: { down: Button_Exit_112x60, up: Button_Exit_112x60 },
Button-Buy: { down: Button_Buy_112x60, up: Button_Buy_112x60 },
Button-Sell: { down: Button_Sell_112x60, up: Button_Sell_112x60 }
},
com.badlogic.gdx.scenes.scene2d.ui.ImageTextButton$ImageTextButtonStyle: {
  shop_item-button-background: { down: shop_item-button-background, up: shop_item-button-background }
},
com..badlogic.gdx.scenes.scene2d.ui.Image: {
  background: { drawable: background },
  shop-items-background: { drawable: shop-items-background },
  shop-menu-background: { drawable: shop-menu-background },
  shop-talk-text-background: { drawable: shop-talk-text-background },
  weapon-shop-portrait_world1: { drawable: weapon-shop-portrait_world1 },
  armor-shop-portrait_world1: { drawable: armor-shop-portrait_world1 },
  item-shop-portrait_world1: { drawable: item-shop-portrait_world1 },
  inn-shop-portrait_world1: { drawable: inn-shop-portrait_world1 }
}

atlas file:

shops-pack.png
format: RGBA8888
filter: Nearest,Nearest
repeat: none
background
  rotate: false
  xy: 0, 504
  size: 800, 480
  orig: 800, 480
  offset: 0, 0
  index: -1
shop-items-background
  rotate: false
  xy: 0, 248
  size: 608, 256
  orig: 608, 256
  offset: 0, 0
  index: -1
shop_item-button-background
  rotate: false
  xy: 0, 60
  size: 256, 60
  orig: 256, 60
  offset: 0, 0
  index: -1
...

Solution

  • There's no reason your Images in your json have to have the same names as the drawables in them. You don't even need to put Images in your skin. Look at the documentation of ImageTextButtonStyle...its parameters are Drawables, not Images. And so that's why it seems like you need to use the exact texture region names.

    Skin automatically creates a TextureRegionDrawable or NinePatchDrawable out of a texture region with that name if you haven't created one in the Skin. But you can create all kinds of Drawables (such as TiledDrawable or TintedDrawable, or a TextureRegionDrawable with custom padding) and specify those as your button's image if you want to.

    Also note in the documentation that ImageTextButtonStyle inherits a member named font from TextButtonStyle, which is not marked as optional in the documentation. So you're getting an exception for using an ImageTextButtonStyle that did not specify a font.

    There are a couple ways you can put a font into your skin. If you have generated a bitmap font with a tool such as BMFont or Heiro, you can pack it into your texture atlas. Simply put the .fnt file and its image into the same directory with your other images that you are packing. And put another copy of the .fnt file into your assets directory, next to your atlas file. Then specify the font in your skin json by using its file name:

    com.badlogic.gdx.graphics.g2d.BitmapFont: { myfont: { file: myfont.fnt } },
    

    If you are using FreeTypeFontGenerator, this is more complicated. Let me know if that's what you're doing.