Loading Alpha TGA for font rendering

ap_kelly · May 24, 2003, 5:47am

Now I know this topic has been covered quite a bit, and I’ve done several searches on this forum and others, but I still can’t get this quite right. I’ve managed it with PNG files without an alpha.

Here is my image that I want to use (it’s been borrowed from Quake till I design my own).
http://users.bigpond.net.au/ap_kelly/projects/screenshots/bigchars.tga

Here is the code I use to init GL


        gl = new GL(this.getClass().getName(), 50, 50, SCREEN_WIDTH, SCREEN_HEIGHT, SCREEN_COLOUR_DEPTH, 1, 0, 0);

Here is my loading code.



  private static int _load32bitImage(Image image) {
    BufferedImage tex = new BufferedImage(image.getWidth(null), image.getHeight(null), BufferedImage.TYPE_4BYTE_ABGR);
    Graphics2D g = (Graphics2D)tex.getGraphics();
    g.drawImage(image, null, null);
    g.dispose();

      // Flip Image
    AffineTransform tx = AffineTransform.getScaleInstance(1, -1);
    tx.translate(0, -image.getHeight(null));
    AffineTransformOp op = new AffineTransformOp(tx, AffineTransformOp.TYPE_NEAREST_NEIGHBOR);
    tex = op.filter(tex, null);

      // Put Image In Memory
    ByteBuffer scratch = ByteBuffer.allocateDirect(4 * tex.getWidth() * tex.getHeight());
    int scratchAddress = Sys.getDirectBufferAddress(scratch);

    byte data[] = (byte[])tex.getRaster().getDataElements(0, 0, tex.getWidth(), tex.getHeight(), null);
    scratch.clear(); 
    scratch.put(data);

      // Create A IntBuffer For Image Address In Memory            
    IntBuffer buf = ByteBuffer.allocateDirect(4).order(ByteOrder.nativeOrder()).asIntBuffer();
    int bufPtr = Sys.getDirectBufferAddress(buf);                  // Get Image Address
    gl.genTextures(1, bufPtr);                                                // Create Texture In OpenGL            

    gl.bindTexture(GL.TEXTURE_2D, buf.get(0));                        // Typical Texture Generation Using Data From The Image

    // Linear Filtering
    gl.texParameteri(GL.TEXTURE_2D, GL.TEXTURE_MAG_FILTER, GL.LINEAR);
    gl.texParameteri(GL.TEXTURE_2D, GL.TEXTURE_MIN_FILTER, GL.LINEAR);

    // Generate The Texture
    gl.texImage2D(GL.TEXTURE_2D, 0, GL.RGBA, tex.getWidth(), tex.getHeight(), 0, GL.RGBA, GL.UNSIGNED_BYTE, scratchAddress);

    return buf.get(0);                                                            // Return Image Address In Memory
  }

Here is my rendering code.



  public static void print(int pX, int pY, String pMsg, int pFontset) {
    if (!initialised) {
      System.out.println("FontUtils.init(GL pGL, GLU pGLU) must be called first.");
    } else {
      gl.enable(GL.TEXTURE_2D);
      gl.enable(GL.BLEND);
      gl.enable(GL.ALPHA_TEST);
      gl.blendFunc(GL.SRC_ALPHA, GL.ONE_MINUS_SRC_ALPHA);
//      gl.blendFunc(GL.SRC_ALPHA, GL.ONE);
//      gl.blendFunc(GL.ONE, GL.ONE);
      gl.bindTexture(GL.TEXTURE_2D, fontTextures[pFontset]);
      gl.translated(pX, pY, 0);

      gl.listBase(fontSets[pFontset]);

      ByteBuffer scratch = ByteBuffer.allocateDirect(pMsg.getBytes().length);
      scratch.put(pMsg.getBytes());
      gl.callLists(pMsg.length(), GL.BYTE, Sys.getDirectBufferAddress(scratch));
//      gl.translated(-(pX + (pMsg.length() * FONT_WIDTH)), -pY, 0);
      gl.disable(GL.ALPHA_TEST);
      gl.disable(GL.BLEND);
      gl.disable(GL.TEXTURE_2D);
    }
  }

All I get is white boxes on the screen rather than the text with transparent/alpha blended backgrounds.

Any advice would be appreciated.

Andy.

princec · May 24, 2003, 9:34am

You haven’t specified the alpha test value. Besides, you don’t even need to do alpha testing for fonts. Disable it. Alpha testing is only for when you’re trying to do depth buffer writes - for example, when you’re rendering “leaves” textures for drawing trees.

Cas

ap_kelly · May 24, 2003, 10:31am

Then how do I get transparent backgrounds on my fonts if I don’t use Alpha blending?

At the moment with my PNGs I get a black background all the time and the gl.colour3f method changes the text colour. I’m looking for a solution to get rid of the black backgrounds and reveal the colour underneath.

Thanks,

Andy.

elias · May 24, 2003, 11:31am

It sounds like you forgot to render the font after all your other rendering. Also remember to disable the zbuffer when rendering the font or simply render the quads with smaller Z values.

elias

ap_kelly · May 24, 2003, 9:52pm

I setup my ortho view in the following way


    pGL.disable(GL.DEPTH_TEST);                                          // Disables Depth Testing
    pGL.matrixMode(GL.PROJECTION);                                    // Select The Projection Matrix
    pGL.pushMatrix();                                                            // Store The Projection Matrix
    pGL.loadIdentity();                                                      // Reset The Projection Matrix
    pGL.ortho(0, 800, 0, 600, -1, 1);
    pGL.matrixMode(GL.MODELVIEW);                                          // Select The Modelview Matrix
    pGL.pushMatrix();                                                            // Store The Modelview Matrix
    pGL.loadIdentity();                                                      // Reset The Modelview Matrix

My fonts are rendered on top of my grey button quads, when I use my 24bit png file to do this the fonts are rendered ok, but the background of the font is black, I want the background of my font to be transparent so that my grey button quads show through. That is why I switched to 32bit tga files cos I thought using the alpha channel would solve my problem.

How do you render a font with transparancy so that what is underneath the text shows through? Code examples or pointers to code would be good. I’ve looked on Chmans site and through the ported NeHe stuff but I haven’t found what I’m looking for.

Here is an example of it almost working with my png file. I’d like the grey of the boxes to show through behind the text.

http://users.bigpond.net.au/ap_kelly/projects/screenshots/png_success.png

Here it is not working with my tga file.

http://users.bigpond.net.au/ap_kelly/projects/screenshots/tga_failure.png

Thanks,

Andy.

ap_kelly · May 25, 2003, 12:15am

I think what I might be asking is this, the Alpha channel of my font contains a mask, how do I go about using this with my font, to give me transparent backgrounds?

Thanks,

Andy.

ap_kelly · May 25, 2003, 2:40am

After much chopping and changing around of code trying all sorts of ideas, rereading NeHe #17 I managed to get this output with my original 24bit png.

http://users.bigpond.net.au/ap_kelly/projects/screenshots/pale_colours.png

Unfortunately the colours seem a little washed out/pale, the word ‘preferences’ should be bright red.

Any thoughts?

Thanks,

Andy.

Orangy_Tang · May 25, 2003, 9:23am

You’re rendering your text onto a grey quad - texture colours and vertex colours get multiplied/modulated by default. Either change your vertex colour to white, or change the texture mode to DECAL (i think it’s glTexEnv*() with GL_DECAL you want).

To use the alpha channel, you’ll want something like:
gl.enable(GL.BLEND);
gl.blendFunc(GL.SRC_ALPHA, GL.ONE_MINUS_SRC_ALPHA);

Edit: actually, seems like you’ve already done that if the grey quads are separate ones sitting behind. In that case check that the alpha values where there is supposed to be solid text are actually 1, or if they are becomming transparent and blending onto the the quad.