Skip to main content
Version: 4.16

Embedded Graphics

The term embedded graphics means many things.

First of, the word embedded means different things to different people. To some an embedded system means a very dependable old 8 bit microcontroller, with no operating system, and virtually no RAM, ROM or GPIO. To others it might mean a modern day smart phone with gigabytes of everything.

Secondly, the word graphics has many interpretations. To some it means drawing your own pixels in your favourite painting program. To others again it means the 3D rendering software running on your gaming console.

To TouchGFX, embedded systems mean any system based on an STM32 microcontroller. And graphics means interactive applications with a user interface running at 60 frames per second.

The four main parts#

In order to do graphics applications on such platforms, we consider four main components directly involved. Naturally many more components might be present in an embedded system, but these are less related to the display of graphics.

MCU, RAM, Flash and display

In short, TouchGFX, using the MCU, creates and updates an image in RAM, by assembling parts from flash. The assembled image is transferred to the display. This process is repeated as often as possible and needed.

MCU#

The MCU is doing all the heavy lifting in this process. It reads images in flash and writes them to RAM. It calculates the resulting colors when merging a semi-transparent red text onto an image and saves these to RAM. It renders and stores all the pixels of a circle to RAM. It transfers the image from RAM to the display.

The MCU provides the CPU, internal flash, internal RAM and much more

STM32 MCUs have specific capabilities, like LTDC, Chrom-ART, Chrom-GRC, ..., that help in the realization of graphics.

RAM#

RAM is where the resulting calculated image (framebuffer) is stored. The RAM is being read and written by the MCU when updating the graphics. And read again when the resulting image is transferred to the display.

In many cases the resulting image is stored in RAM internal to the MCU. In cases where it is not feasible to have the resulting image in internal RAM, external RAM can be added to the setup.

Flash#

Flash is where all static data is placed. Images, fonts and texts. The flash is read by the MCU and the contents written to or combined with the RAM.

Most often an external flash is added to the setup, as the internal flash is seldomly large enough to hold all graphics assets. For very simple applications the internal flash is enough.

Ideally the flash is memory mapped, such that pixels can be read directly from the flash and written to RAM. Otherwise, when the flash is not memory mapped, the contents of the flash can be transferred to RAM and then read from there instead.

Display#

The display is where the image is actually displayed to the eyes of a person.

The calculated image (framebuffer) stored in RAM is sent by the MCU to the display at regular intervals.

Further reading
  • See Hardware selection for details on the possible hardware choices.
  • See Board Bring Up for details on setting up the board and components.