Main Content

ILI9341 TFT LCD - tiny anti-aliased colour text

It has colour so use it! 5x10 character cells. Amazingly legible. Small. Fast. Minimal dependencies.

The Motivation
320x240 pixel colour TFT LCDs with the ILI9341 controller are very common but I’ve only found one library that takes advantage of the colour when it comes to rendering small text (anti-aliasing).

Most existing libraries are bloated or not fast enough to render an entire screen of text at a reasonable speed.

This minimalist library aims to address these issues and will be my Arduino screen driver for my Hopper project.

Hopper & Character UI
The Hopper project requires a text UI for the shell, the editor, the debugger, etc. I like the ubiquitous and affordable 320x240 TFTs and figured with a 5x10 character cell I could get a text display of 64 columns by 24 rows. This should be enough for my purposes.

I settled on two blank pixel rows and one blank pixel column between characters so the actual font cell is only 4x8 pixels.

Colour and Anti-Aliasing
Typical ILI9341 libraries use RGB565 (16 bits). The symmetry of RGB444 (12 bits) makes it simpler to blend foreground and background colours (anti-aliasing) so my font template uses a non-linear 16 tone palette (4 bpp). I blend RGB444 foreground and background colours using this tone palette for each pixel in the character. Then I transform from RGB444 to RGB565 for rendering.

Creating the Font
I use a C# Windows Forms application on Windows to generate my font template (from Consolas) and used Hopper on Windows to create some test data (for now).

The font is captured at 4 bits per pixel in what I refer to as “tones”. You can think of them as 16 shades of gray (even though they are actually not linearly mapped to 0..255 when blending colours).

Font template size: 4 bpp, 94 characters, 4x8 size = 1504 bytes.”

Link to article