Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

libgdx draw chinese characters

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() {
}
    }
like image 222
Michael S Avatar asked Mar 19 '14 22:03

Michael S


3 Answers

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.

like image 162
Chase Avatar answered Sep 21 '22 17:09

Chase


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

like image 25
Junxiao Wang Avatar answered Sep 19 '22 17:09

Junxiao Wang


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.

like image 26
Laur Ivan Avatar answered Sep 21 '22 17:09

Laur Ivan