objarni's picture

Texture font experiment

I've thought about trying out "texture font rendering" for some weeks.

So I google "texture font" and grabbed the first available font. It was a 512x512 pixel PNG in RGBA format (32-bit) featuring a black/white simple font. It'll do.

First thing I did was load the texture into the GLControl tutorial program, to just be able to render a.s.a.p.

Next step: render the whole 512x512 texture as a single quad all over the viewport, to see how it looks when resizing the window.

Images

Comments

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.
objarni's picture

Rendered all over the viewport. Since TexUtil uses pick-nearest filters, I think it can be better if changing to linear interpolation instead.

Edit: I cannot see the attached image to this comment. I get Page not found errors. Is it the 512 kb limit that has been reached for my OpenTK account?

objarni's picture

Tried setting the viewport to exactly 512x512 to see the texture in "crisp condition".

the Fiddler's picture

Hm, the pictures don't exist on the filesystem. I'm looking into it, you could try imageshack in the meanwhile.

martinsm's picture

There is nice tool called Bitmap Font Generator on angelcode.com, that can generate texture (one or more) with unicode characters you select from any font installed in your system (Windows).

objarni's picture

OK I think I found the problem regarding the files: while I still had the WinForm open, the files were inaccessible to Firefox/OpenTKs upload process - the same thing happened at ImageShack. Solution: close WinForm app before clicking "Attach" :)

Do you want me to keep uploading to ImageShack instead of OpenTK?

Latest version: changed to TextureMinFilter in TexParameter call of TexUtil. A slight improvement in visual quality I believe.

objarni's picture

@martinsm Thanks that might come in handy!

Next step: play with colors!

the Fiddler's picture

My question is: why replicate all the work done by the TextPrinter? The TextPrinter works exactly like this, only it generates the textures at runtime and uses better layout algorithms (better in the sense that GDI+, the internal implementation, supports composite graphemes and kerning).

Using a texture like this, limits you to a predefined size (as you can see in your first screenshot, you cannot zoom or scale) and specific fonts.

Edit: you can upload here, but be warned there is a per-user limit, to avoid abuse.

objarni's picture

OK I tried changing the colors of all corners. It was actually more appealing than I had imagined ;)

Next step: add some background image. Google!

objarni's picture

Image shack wouldn't accept a 670 kb image so I had to resize the viewport to something smaller. It looks alright still, I think.

Now onto: writing "Hello world", that is creating a "WriteCharacter(char ascii)" method.

objarni's picture

.. and we got an "H"!

Onto WriteText(string text)..