libgdx draw chinese characters

Question

I like to print Chinese text in my application.

1.When I try this, the screen will be empty. There is no error at the console.

Create method:

FreeTypeFontGenerator gen = new FreeTypeFontGenerator(Gdx.files.internal("fonts/DFLS1B.TTF"));
font = gen.generateFont(40, "好", false);

Render method:

spriteBatch.setColor(1, 1, 1, 1);
spriteBatch.begin();
font.draw(spriteBatch, "好", 10, 100);
spriteBatch.end();

2.When I try this, 3 different Chinese characters show up on screen but I have no idea why these characters where draw. There is no connection between asd and the three characters

Create method:

FreeTypeFontGenerator gen = new FreeTypeFontGenerator(Gdx.files.internal("fonts/DFLS1B.TTF"));
font = gen.generateFont(40);

Render method:

spriteBatch.setColor(1, 1, 1, 1);
spriteBatch.begin();
font.draw(spriteBatch, "asd", 10, 100);
spriteBatch.end();

Does anyone know how to draw Chinese character in libgdx correct (I use the current version of libgdx)? For example: How are you? - Ni hao ma? - 你 好 吗?

Greetings

---

EDIT: Here is a full example which will show expected Chinese characters on the screen. I have downloaded the font from here: http://www.study-area.org/apt/firefly-font/

package com.mytest;

import com.badlogic.gdx.ApplicationListener;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.g2d.BitmapFont;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.freetype.FreeTypeFontGenerator;
import com.badlogic.gdx.scenes.scene2d.Stage;

public class ChineseFontTest implements ApplicationListener {

private Stage stage;
private SpriteBatch spriteBatch;
public BitmapFont font;

@Override
public void create() {
    stage = new Stage(800, 800);
    spriteBatch = new SpriteBatch();

    FreeTypeFontGenerator gen = new FreeTypeFontGenerator(Gdx.files.internal("fonts/fireflysung.ttf"));
    font = gen.generateFont(40, "好你吗", false);

}

@Override
public void dispose() {
    stage.dispose();
}

@Override
public void render() {      
    Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
    spriteBatch.setColor(1, 1, 1, 1);
    spriteBatch.begin();
    font.draw(spriteBatch, "你好吗", 10, 100);
    spriteBatch.end();
}

@Override
public void resize(int width, int height) {
}

@Override
public void pause() {
}

@Override
public void resume() {
}
    }

Berry

Answer 1

Go to http://www.angelcode.com/products/bmfont/ and get BMFont and use it to look at your font. You can also pregenerate libgdx bitmap font files with it. The problem is that your font is not a unicode font.

When you are typing Java code the "好" symbol is translated to the value U+597D. The font ttf file you are using is an old-school non-unicode font. The way these older font files work is that they replace a letter like "a" with a different picture. "a" is U+61. So in your program the letter "a" is converted to U+61 which maps to a chinese character symbol but "好" with a value of U+597D does not.

You can either continue to use your font and look up the position of every character so that you can use the correct number. Don't use "a" instead use something like (char)0x61 so it is a little less confusing. Or...

Just get a valid unicode font that contains the "好" symbol at U+597D.

Erikaerikson

Thank you for your explanation and advice. I was able to sold the problem now. I also add a full example, hope it will help someone in the future. 謝謝 – Berry

DroidSansFallback has chinese characters. You can get it from github.com/android/platform_frameworks_base/tree/master/data/… (or you should have a copy in your android sdk folder). If you use this font there would be a good chance the symbols look very close to the rest of the Android apps on the phone (if that is a goal). – Erikaerikson

Ahh, thank you for the link a will have a look. The ttf I used is > 12 MB but these files are much smaller. – Berry

Answer 2

This is my answer:

package com.wang.libgdx.test.my;

import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.GL20; 
import com.badlogic.gdx.graphics.g2d.BitmapFont;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.freetype.FreeTypeFontGenerator;
import com.badlogic.gdx.graphics.g2d.freetype.FreeTypeFontGenerator.FreeTypeFontParameter;
import com.badlogic.gdx.scenes.scene2d.Stage;
import com.badlogic.gdx.scenes.scene2d.ui.Skin;
import com.wang.libgdx.test.utils.GdxTest;

public class TtfFontTest extends GdxTest{

SpriteBatch spriteBatch;
BitmapFont font;

@Override
public void create() {
    spriteBatch  = new SpriteBatch();

    FreeTypeFontParameter parameter = new FreeTypeFontParameter();
    parameter.characters=FreeTypeFontGenerator.DEFAULT_CHARS + "你好";
    parameter.size = 24;
    FreeTypeFontGenerator generator = new FreeTypeFontGenerator(Gdx.files.internal("data/ui/fangzheng.ttf"));
    font = generator.generateFont(parameter);
    generator.dispose();

}

@Override
public void dispose() {
    spriteBatch.dispose();
    font.dispose();
}

@Override
public void render() {
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
    spriteBatch.begin();
    font.draw(spriteBatch, "helloworld", 300,300);
    font.draw(spriteBatch, "你好，世界！", 300,330);
    spriteBatch.end();
}

}

this is result of the program. enter image description here

Hearten

Answer 3

The freetype loader in libGDX actually creates a BitmapFont. To do that, it'll need a list of characters. The default list is only alphanumerics. To render unicode, you'll need to replace/append that list with the unicode characters you need.

Following code should be some help (I'm using the AssetManager):

FreeTypeFontLoaderParameter parameter = new FreeTypeFontLoaderParameter();
parameter.fontParameters.size = size;
parameter.fontFileName = "fonts/DFLS1B.ttf";
parameter.fontParameters.color = Color.WHITE;
parameter.fontParameters.characters = characters; // <-- here you give it the unicode list
parameter.fontParameters.magFilter = Texture.TextureFilter.Linear;
manager.load(sz, BitmapFont.class, parameter);
manager.finishLoadingAsset(sz);

Note: If you use the asset manager you'll need to set the loaders like in their example:

FileHandleResolver resolver = new InternalFileHandleResolver();
manager.setLoader(FreeTypeFontGenerator.class,
    new FreeTypeFontGeneratorLoader(resolver));
manager.setLoader(BitmapFont.class, ".ttf", 
    new FreetypeFontLoader(resolver));

I've also found this answer.

Kempf