OpenGL 2D Facade (14): Unicode text

The creation of a tileset for large character sets uses a lot of memory. This post shows an approach based on the Flyweight pattern to allow their usage with minimal memory footprint.

This post is part of the OpenGL 2D Facade series

Objective

The objective is similar to the previous one, except that we want to draw characters from large sets, possibly more than 10,000 characters:

With the previous approach, with 10,000 characters and tiles of 29 per 64 pixels, a tileset uses at least 74MB. Even if we save some memory using tricks (like using a single channel rather than four), it is still large. Furthermore, it is for one size and style: we have to create more tilesets for other sizes and styles (bold, italic, shadowed, etc.).

Thanks to this post’s approach, we can create tilesets that only contain the characters we need for the current frame. It is unlikely that a frame has all the characters of a large set, and in usual cases, it is a tiny subset.

In the example above, the program creates the following tileset:

OpenGL 2D Facade minimal text tileset
Continue reading
Posted in Tutorial | Leave a comment

OpenGL 2D Facade (13): Text

In this post, I start to address a more advanced topic: text rendering with OpenGL. I first consider a simple case with monospaced fonts and small character sets.

This post is part of the OpenGL 2D Facade series

Objective

To test this new feature, I propose to draw text over the other layers. I update the text regularly, so we can check that we support dynamic text rendering:

Continue reading
Posted in Tutorial | Tagged , | Leave a comment

OpenGL 2D Facade (12): Characters

In this post, I add a new type of layer dedicated to characters. These layers can draw tiles anywhere and updates their OpenGL data every time we render a frame.

This post is part of the OpenGL 2D Facade series

Objective

To check that the new layer type works fine, I propose to move a character in the level using the arrow keys:

There are no collision checks; the character can go anywhere, as long as it is inside the world. Also, note that the view follows the character.

Continue reading
Posted in Tutorial | Tagged , | Leave a comment

OpenGL 2D Facade (11): View and Keyboard

With the previous program, the size of the window depends on the size of the level, which is problematic when the level is large. In this post, I update the shader programs to get a fast translation of the display. I also add keyboard handling to the facade to let the user changes the view.

Continue reading
Posted in Tutorial | Tagged , , | Leave a comment

OpenGL 2D Facade (10): Layers

In this post, we extend the facade to handle several layers. We also see how to draw with transparency.

Continue reading
Posted in Tutorial | Tagged , , | Leave a comment

OpenGL 2D Facade (9): Load a level

Before handling the rendering of several layers, we need data to build them. Rather than copy and paste many ids from a Tiled map file, I propose to read them using the TMX library.

Continue reading
Posted in Tutorial | Tagged , , | Leave a comment

OpenGL 2D Facade (8): Facade

I have enough content to start a facade: I refactorize all the code to satisfy the properties of the Facade pattern and get a more robust and extensible implementation.

Continue reading
Posted in Tutorial | Tagged , , , | Leave a comment

OpenGL 2D Facade (7): Draw a level

In this post, I show how to draw many tiles from a single-layer level created with Tiled. I also show how to take a screen capture with OpenGL.

Continue reading
Posted in Tutorial | Tagged , | Leave a comment

OpenGL 2D Facade (6): Draw a tile

Textures in the previous post allow the drawing of tiles, but the aspect ratio is not correct. In this post, I show how to draw a tile on a grid location correctly.

Continue reading
Posted in Tutorial | Tagged , | Leave a comment

OpenGL 2D Facade (5): Textures

In this post, I introduce OpenGL textures and use them to draw tiles from tilesets.

Continue reading
Posted in Tutorial | Tagged , | Leave a comment