开发者

Trying to draw text in OpenGL, but texture is offset slightly

I am trying to draw text in OpenGL. I used a small C# program to draw all characters from 0x21 to 0x7E into a bitmap. I load that as a texture and try to use that to draw my text. It appears to work, but I seem to get some weird problems. http://i54.tinypic.com/mmd7k8.png Notice the extra pixel next to 'a' and the fact that 'c' is cut off slightly. It appears the whole thing is shifted slightly. Does anybody know why I get this problem? I don't want to use a library such as gltext because I don't want to depend on libfreetype as I am only drawing a few strings. Here is the code that I am using:

static void textDrawChar(char c, int x, int y)
{
GLfloat vert[8];
GLfloat texcoord[8];

vert[0] = x;                            vert[1] = y;
vert[2] = x;                            vert[3] = y + TEXT_HEIGHT;
vert[4] = x + font_char_width[c-0x21];  vert[5] = y + TEXT_HEIGHT;
vert[6] = x + font_char_width[c-0x21];  vert[7] = y;

texcoord[0] = (float)(font_char_pos[c-0x21])/TOTAL_WIDTH;
texcoord[1] = 1.0f;
texcoord[2] = (float)(font_char_pos[c-0x21])/TOTAL_WIDTH;
texcoord[3] = 0.0f;
texcoord[4] = (float)(font_char_pos[c-0x21] + font_char_width[c-0x21])/TOTAL_WIDTH;
texcoord[5] = 0.0f;
texcoord[6] = (float)(font_char_pos[c-0x21] + font_char_width[c-0x21])/TOTAL_WIDTH;
texcoord[7] = 1.0f;

glBindTexture(GL_TEXTURE_2D, texture);
glVertexPointer(2, GL_FLOAT, 0, vert);
开发者_运维问答glTexCoordPointer(2, GL_FLOAT, 0, texcoord);
glDrawElements(GL_TRIANGLE_STRIP, 4, GL_UNSIGNED_BYTE, indices);
}

void textDraw(void)
{
textDrawChar('a', 300, 300);
textDrawChar('b', 300+font_char_width['a'-0x21], 300);
textDrawChar('c', 300+font_char_width['a'-0x21]+font_char_width['b'-0x21], 300);
}

EDIT I added 4 to the texture coordinate (0,2,4,6) and that seems to have fixed the problem. However, now I need to know whether that will continue to work or may break for unknown reasons. Here is the bitmap creation code, in case the problem might be in there.

using System;
using System.Drawing;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.IO;
using System.Collections;

namespace font_to_bmp
{
class Program
{
    static void Main(string[] args)
    {
        Bitmap b = new Bitmap(1715, 36);
        Graphics g = Graphics.FromImage(b);
        g.FillRectangle(new SolidBrush(Color.Transparent), 0, 0, 1715, 36);
        Font f = new Font("Liberation Sans", 24, GraphicsUnit.Point);
        g.PageUnit = GraphicsUnit.Pixel;
        int curx = 0;
        StreamWriter w = new StreamWriter(new FileStream("font_width.h", FileMode.Create, FileAccess.Write, FileShare.Read));
        w.WriteLine("static const int font_char_width[] = {");
        ArrayList hax = new ArrayList();
        for (int i = 0x21; i <= 0x7E; i++)
        {
            char c = (char)i;
            string s = c.ToString();
            SizeF sz = g.MeasureString(s, f);
            StringFormat sf = new StringFormat();
            sf.SetMeasurableCharacterRanges(new CharacterRange[] {new CharacterRange(0,1)});
            Region r = g.MeasureCharacterRanges(s, f, new RectangleF(0, 0, 1000, 1000), sf)[0];
            RectangleF r2 = r.GetBounds(g);
            Console.WriteLine("{0} is {1}x{2}", s, r2.Width, r2.Height);
            int w_int = (int)(Math.Ceiling(r2.Width));
            g.DrawString(s, f, new SolidBrush(Color.Black), curx, 0);
            hax.Add(curx);
            curx += w_int;
            w.WriteLine("\t{0},", w_int);
        }
        Console.WriteLine("Total width {0}", curx);
        w.WriteLine("};");
        w.WriteLine();

        w.WriteLine("static const int font_char_pos[] = {");

        foreach(int z in hax)
        {
            w.WriteLine("\t{0},", z);
        }
        w.WriteLine("};");

        w.Close();
        b.Save("font.png");
    }
}
}


Addressing the pixels exactly in a texture is a bit tricky. See my answer given in OpenGL Texture Coordinates in Pixel Space


This has been asked a few times, but I don't have the links at hand, so a quick and rough explanation. Let's say the texture is 8 pixels wide:

 | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 |
 ^   ^   ^   ^   ^   ^   ^   ^   ^
0.0  |   |   |   |   |   |   |  1.0
 |   |   |   |   |   |   |   |   |
0/8 1/8 2/8 3/8 4/8 5/8 6/8 7/8 8/8

The digits denote the texture's pixels, the bars the edges of the texture and in case of nearest filtering the border between pixels. You however want to hit the pixels' centers. So you're interested in the texture coordinates

(0/8 + 1/8)/2 = 1 / (2 * 8)

(1/8 + 2/8)/2 = 3 / (2 * 8)

...

(7/8 + 8/8)/2 = 15 / (2 * 8)

Or more generally for pixel i in a N wide texture the proper texture coordinate is

(2i - 1)/(2N)

However if you want to perfectly align your texture with the screen pixels, remember that what you specify as coordinates are not a quad's pixels, but edges, which, depending on projection may align with screen pixel edges, not centers, thus may require other texture coordinates.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜