javaopenglbitmaplibgdxpixmap

Generating textures at runtime with text using libgdx


I'm working on a phone word game. Yesterday I decided to switch to OpenGL using libgdx to try and improve graphics performance and battery usage + to target more platforms.

The way letter tile drawing was working on a 2D canvas was each letter tile would create a bitmap for itself. I would:

  1. Create a new mutable bitmap from the background bitmap.
  2. Draw on the letter on the new bitmap.
  3. Apply other tile specific effects.
  4. Draw the new bitmap for each frame

What's the best way for me to achieve what I want using libgdx?

  1. Should I adopt a similar approach? If so, how? I tried using pixmaps but couldn't work out how to draw the font.
  2. Should I create a spritesheet with all the required tiles from A-Z and just use that? A bit tedious when I tweak the design of the tile background.
  3. Should I do something totally different?

Answer

Obviously the final code shouldn't load from the files every time, as this is a massive performance hit, but here's working sample code for anyone else who is trying to achieve the same result.

    // load the background into a pixmap
    Pixmap tile = new Pixmap(Gdx.files.getFileHandle(
            "someFile.png", FileType.Internal));

    // load the font
    FileHandle handle = Gdx.files.getFileHandle("someFont.fnt",
            FileType.Internal);
    BitmapFont font = new BitmapFont(handle);

    // get the glypth info
    BitmapFontData data = font.getData();
    Pixmap fontPixmap = new Pixmap(Gdx.files.internal(data.imagePaths[0]));
    Glyph glyph = data.getGlyph(getLetterToDraw().charAt(0));

    // draw the character onto our base pixmap
    tile.drawPixmap(fontPixmap, (TILE_WIDTH - glyph.width) / 2, (TILE_HEIGHT - glyph.height) / 2,
            glyph.srcX, glyph.srcY, glyph.width, glyph.height);

    // save this as a new texture
    texture = new Texture(tile);

Solution

  • Quote: You can create a BitmapFontData instance and use BitmapFontData.getImagePath() to load a Pixmap containing the glyphs. You can then use BitmapFontData.getGlyph to get the location of a specific glyph in the Pixmap, which you can use with Pixmap.drawPixmap() to do what you want to do. Source: libgdx Issue 691: Draw BitmapFont to Pixmap/Texture


    You get the path to the BitmapFontData and create a new Pixmap with the Filehandle to the path with this:

    Pixmap(FileHandle file)

    Creates a new Pixmap instance from the given file.

    Source: PixmapAPI

    Use Gdx.files.internal(pathfromBitmapFontData)as filehandle and you got the pixmap with all Glyps inside.

    Pixmap p = new Pixmap(Gdx.files.internal(myBitmapFontData.getImagePath()))

    try out if its an internal! Meight be not an internal file i dont know it


    Pixmap p = new Pixmap(myFont.getData().getFontFile());

    this should also work