How to draw a BitmapFont in LibGDX?

Question

I'm seriously betting that I did something effing stupid and just can't seem to notice it.

package com.me.mygdxgame;

import com.badlogic.gdx.ApplicationListener;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.Texture.TextureFilter;
import com.badlogic.gdx.graphics.g2d.BitmapFont;
import com.badlogic.gdx.graphics.g2d.Sprite;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;

public class Locked implements ApplicationListener
{
    private OrthographicCamera camera;
    private SpriteBatch batch;
    private Texture texture;
    private Sprite sprite;
    private BitmapFont font;
    private CharSequence str = "Hello World!";
    private float width;
    private float height;

    @Override
    public void create()
    {
        width = Gdx.graphics.getWidth();
        height = Gdx.graphics.getHeight();

        camera = new OrthographicCamera(1, height / width);
        batch = new SpriteBatch();

        texture = new Texture(Gdx.files.internal("data/libgdx.png"));
        texture.setFilter(TextureFilter.Linear, TextureFilter.Linear);

        TextureRegion region = new TextureRegion(texture, 0, 0, 512, 275);

        sprite = new Sprite(region);
        sprite.setSize(0.9f, 0.9f * sprite.getHeight() / sprite.getWidth());
        sprite.setOrigin(sprite.getWidth() / 2, sprite.getHeight() / 2);
        sprite.setPosition(-sprite.getWidth() / 2, -sprite.getHeight() / 2);

        font = new BitmapFont(Gdx.files.internal("data/digib.fnt"),
                Gdx.files.internal("data/digib.png"), false);
    }

    @Override
    public void dispose()
    {
        batch.dispose();
        texture.dispose();
    }

    @Override
    public void render()
    {
        Gdx.gl.glClearColor(1, 1, 1, 1);
        Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT);

        batch.setProjectionMatrix(camera.combined);
        batch.begin();
        font.setColor(0.0f, 0.0f, 0.0f, 1.0f);

        //sprite.draw(batch);
        font.draw(batch, str, width*0.5f, height*0.5f);
        batch.end();
    }

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

    @Override
    public void pause()
    {
    }

    @Override
    public void resume()
    {
    }
}

The project was generated with the template tool they provide gdx-setup-ui.jar As you can see in the code, I didn't bother to get rid of the default codes (Just some simple draw codes to render the LibGDX logo).

So, with the cleanly generated project, I followed this guide here http://code.google.com/p/libgdx-users/wiki/addingText2D

and finally arriving with the provided code above.

The problem is, why won't the !@#$ing text show!? I changed the position so many times and still no luck :\\

Did I miss something?

FYI: The fonts are fine, I dropped them into another game and it works.

Answer 1

Try to change projection matrix like this:

Matrix4 normalProjection = new Matrix4().setToOrtho2D(0, 0, Gdx.graphics.getWidth(),  Gdx.graphics.getHeight());

batch.setProjectionMatrix(normalProjection);

Answer 2

All I do is

    spriteBatch = new SpriteBatch();
 font = new BitmapFont(Gdx.files.internal("data/nameOfFont.fnt"),
         Gdx.files.internal("data/nameOfFont.png"), false);

and in render method

spriteBatch.begin();
 font.setColor(1.0f, 1.0f, 1.0f, 1.0f);
 font.draw(spriteBatch, "some string", 25, 160);
 spriteBatch.end();

You can read something more about it on my blog: http://algorhymes.wordpress.com/2012/11/17/javalibgdx-fonts/

Answer 3

Personally I'm not a big fan of converting all the fonts to .fnt format. If you need different sizes for a certain font you have to spend a lot of time (and app space) to make all the conversions.

You can just use the FreeType Extension and load straight from a .ttf

FreeTypeFontGenerator generator = new FreeTypeFontGenerator(fontFile);
BitmapFont font15 = generator.generateFont(15);
BitmapFont font22 = generator.generateFont(22);
generator.dispose();

More info here

Rendering is done in the same way as explained by watis.

Answer 4

create a .fnt file using hiero which is provided by libgdx website

set the size of font 150 ,it will create a .fnt file and a png file

copy both of file in your assests folder

now declare the font

BitmapFont font;

nw in create method

font = new BitmapFont(Gdx.files.internal("data/100.fnt"), false);//100 is the font name you can give your font any name

in render

font.setscale(.2f);

font.draw(batch, "whatever you want to write", x,y);

this will work smoothly

Answer 5

The main problem with your code is that you have created camera with
viewportWidth = 1 &
viewportHeight = width/height

and you are drawing font at width*0.5f & height*0.5f which is out of scope from camera

Either change the camera initialization to

camera = new OrthographicCamera(width, height);

.... or change the draw font statement to

font.setScale(1,height/width);
font.draw(batch, str, 0.5f, height/width*0.5f);

Answer 6

Did you try giving position manually like this. I hope this will work batch.setProjectionMatrix(camera.combined); batch.enableBlending(); batch.begin();
font.draw(batch, yourString, 100,100);
batch.end();