Putting Freetypefont into libgdx skin

Question

In my uiskin.json I have this

com.badlogic.gdx.graphics.g2d.BitmapFont: { default-font: { file: text/default.fnt } }

This is fine for when I have the default.fnt in my text folder in the assets folder...

However I want to use a Freetypefont.

How do I create a Freetypefont and load it into the uiskin file?

Answer 1

Update

Thanks to a comment from Jos van Egmond telling me how to do this and still load the Skin from the AssetManager I have decided to update the answer. The old answer (and the alternative way of doing this) still remains untouched below.

The new procedure goes like this:

• Load your font files.
• Create an ObjectMap<String, Object> and put your fonts in this map.
• Create a SkinParameter and give it the ObjectMap as a parameter.
• Load your Skin through the AsserManager as usual using the created SkinParameter.

The code might look something like this:

/* Load your fonts */
load font1...
load font2...

/* Create the ObjectMap and add the fonts to it */
ObjectMap<String, Object> fontMap = new ObjectMap<String, Object>();
fontMap.put("font1", font1);
fontMap.put("font2", font2);

/* Create the SkinParameter and supply the ObjectMap to it */
SkinParameter parameter = new SkinParameter(fontMap);

/* Load the skin as usual */
assetManager.load("file/location/of/your/skin", Skin.class, parameter);

---

Old

The current accepted answer is actually (kind of) incorrect. This blog post describes a way for you to reference generated BitmapFonts in your Json file. The procedure goes something like this:

• Create blank skin file using the default constructor.
• Add your fonts to the skin.
• Add your atlas file to your skin.
• Load your Json file to your skin.

The code might look something like this:

// Create a new skin using the default constructor and
// add your fonts to it.
Skin skin = new Skin();
skin.add("myFont", myFont, BitmapFont.class);

// Remember that this texture atlas is NOT automatically disposed by the skin, 
// so keep a reference and dispose of it yourself.
skin.addRegion(new TextureAtlas("file/location/of/your/atlas");
skin.load(Gdx.files.internal("file/location/of/your/skin"));

You can now do something like this in your skin Json:

...,
font: "myFont",
...

Although this is a workaround this also means that you cannot (at least I haven't found a way to) load your skin through an AssetManager. You can still load the TextureAtlas through the manager though.

Answer 2

It is not possible to do it beforehand, since you are going to generate it at runtime.

My workaround would be to keep the default font as it is and replace it at runtime via code. You can use Skin.add(...) for that.

BitmapFont newDefaultFont = FreeTypeFontGenerator...;
skin.add("default-font", newDefaultFont, BitmapFont.class);

Answer 3

I faced the same issue. The current answers didn't solve it, but helped clear it up. In my case, this worked:

FreeTypeFontGenerator fontGenerator = new FreeTypeFontGenerator(Gdx.files.internal("VT323.ttf"));
FreeTypeFontGenerator.FreeTypeFontParameter fontParameter = new FreeTypeFontGenerator.FreeTypeFontParameter();

fontParameter.size = 24;
fontParameter.borderWidth = 3.6f;
fontParameter.color = new Color(1, 1, 1, 0.3f);
fontParameter.borderColor = new Color(0, 0, 0, 0.3f);

BitmapFont font = fontGenerator.generateFont(fontParameter);

fontParameter.size = 32;

BitmapFont title = fontGenerator.generateFont(fontParameter);

Skin skin = new Skin(new TextureAtlas(Gdx.files.internal("skins.atlas")));
skin.add("font", font);
skin.add("title", title);
skin.load(Gdx.files.internal("skins.json"));

The skins.json, skins.atlas and skins.png files were generated using the Skin Composer