STM32 Graphical User Interface

Overview
Building blocks
Build your own GUI
Ecosystem
Resources
Videos
 

The design trends in embedded HMI (Human-Machine Interface) are continuously evolving. With products getting smarter and offering an increasing number of features, end users expect HMIs to provide an engaging experience and easy access to product features.

Including a GUI (Graphical User Interface) in your products will allow you to design a more user-friendly, safe, and modern device, offering end users more value. The key design requirements of GUIs are shaped by the one device we all interact with every day: the smartphone in our pockets.

Ready to get started?

The STM32 family provides the tools required to easily add smartphone-like Graphical User Interfaces (GUIs) in embedded devices, accelerating the "HMI of Things" revolution.

stm32 boosting the hmi of things
STM32 boosting the HMI-of-things (2:13)
Wondering what type of GUI you can develop with our STM32 GUI solution?
Discover customer success stories in our brochure. Download now.

What it takes to develop a GUI

Creating a good GUI requires skills and expertise, and involves many building blocks, starting with the selection and sourcing of the right display and casing, the art-creation of menus and screens, the programming of the art-design into a user interface and the electronic development, before being able to connect the dots and to trigger the spark that will bring your design to life.

We know it can be overwhelming to develop a GUI.

That is the reason why ST provides state-of-the-art MPUs and MCUs, combined with the tools and the support you need every step of the way, to ensure you bring your GUI project to success.

design gui components

Build your own smartphone-like GUI

Built on four pillars, the STM32 GUI offer helps you move forward with your design, from idea to final product:

stm32 logo
STM32 GUI hardware portfolio
The industry’s broadest portfolio of advanced graphics enabled MCUs and MPUs
stm32 gui software
STM32 GUI Software
State-of-the-art graphical development tools available for free with TouchGFX and STemWIN
stm32 gui ecosystems
STM32 GUI ecosystem
Reference designs, selected GUI software and design partners
stm32 gui resources
STM32 GUI Resources
Support, online community and documentation to help you find answers to your questions
1

Define your needs and select your MCU & developer kit accordingly

Discover the STM32 portfolio of graphics enabled MCUs

To design embedded products offering an outstanding user experience, the STM32 family offers the industry’s broadest range of graphics-enabled MCUs with over 200 active part numbers, supporting different display interfaces and packaging options.

The STM32 graphics enabled MCUs embed different features that allow developers to achieve the desired performance and optimization trade-offs required for embedded devices, such as:

  • The Chrom-ART Accelerator™ offers memory-efficient 2D graphics acceleration and enables smooth transitions and transparency effects while offloading the main CPU
  • The Neo-Chrom offloads the CPU from graphical tasks, lowers memory consumption, increases GUI performance for smoother and richer graphical effects, enabling 3D-like graphics on an STM32 microcontroller
  • The JPEG codec allows you to add M-JPEG videos for branding and tutorials
  • Fast access to internal and external memory avoids bottlenecks, supporting smooth animations
  • The large internal memory supports a one-chip solution, without requiring an external RAM and Flash for small-resolution displays. This brings you additional flexibility to secure system architecture, your buffer strategy and memory budget
  • Support for large display interfaces with parallel interfaces, LCD-TFT, and MIPI-DSI embedded controllers
gui development products Discover our portfolio

STM32 GUI developer kits

The STM32 offer for Graphical User Interfaces includes a large choice of developer kits, software examples and demos.

Each developer kit comes with a flashed demonstration. The code for each demo is made available in the associated STM32Cube software packages.

2

Download TouchGFX

What is TouchGFX

Integrated in the STM32 ecosystem, TouchGFX is a free GUI tool providing everything you need to create cutting-edge GUIs.

TouchGFX is delivered in the X-CUBE-TOUCHGFX package which includes:

  • TouchGFX Designer, a PC GUI-builder and simulator
  • TouchGFX Generator, to configure and generate a TouchGFX project
  • TouchGFX Engine, which is an optimized, hardware-accelerated graphical library
video touchgfx
Discover what TouchGFX is all about
 
touchgfx designer

Easy GUI development

Develop outstanding GUIs effortlessly with the WYSIWYG GUI simulator and TouchGFX Designer.

Unlimited possibilities

The structure and flexibility of TouchGFX gives developers the tools they need to easily create unique UI designs:

    The enabling technology:
  • Run simulator on PC or your target HW
  • Combine your user-code with TouchGFX Designer generated code
  • Create your own software elements with existing widgets
  • Design your own widgets
  • GUI written in C++
  • The Model-View-Presenter pattern gives way for easy interfacing with other C/C++ application components
touchgfx designer

Faster UI project generation and low-level development

  • Easily configure:
    • Memory components
    • Framebuffers
    • Display resolution
    • Color depth
  • Select your preferred IDE
  • Change to other RTOS or no RTOS
    The enabling technology:
  • STM32CubeMX plugin to configure and generate TouchGFX Abstraction Layer (AL) for your STM32-based hardware
  • TouchGFX AL enables graphics hardware acceleration and optimization
  • IDE independent
    Works smoothly with STM32CubeIDE, IAR Workbench, ARM Keil
design gui software
touchgfx engine

Enhanced Performance

The TouchGFX Engine technology enables you to achieve the highest level of smartphone-like GUI performance on STM32 devices

    The enabling technology:
  • Optimized for minimum MCU Load and memory footprint
    Compile and Run time Analysis
    STM32 hardware acceleration
  • Advanced rendering algorithms
    Algorithm for optimized visible surface determination and customized invalidation techniques minimize the number of drawn pixels
  • Advanced graphical objects
    Draw lines, circles, custom shapes, and graphics, or apply scaling and 3D rotation to images at runtime with highly optimized and memory-efficient widgets
touchgfx engine

STemWIN library

STemWin is a simple graphical software framework optimized for STM32 microcontrollers.

STemWin is based on a graphical library from SEGGER Microcontroller GmbH and is available in a binary form, which is free of charge on STM32 MCUs.

This library is a professional graphical stack library to build Graphical User Interfaces (GUIs) with any STM32, any LCD/TFT display and any LCD/TFT controller, taking advantage of STM32 hardware accelerations whenever possible.

The STemWin Library is a comprehensive solution that comes with a rich feature set, such as JPG, GIF and PNG decoding, many widgets (checkboxes, buttons…) and a VNC server enabling the remote display of local displays, as well as professional development tools, such as GUIBuilder to create GUIs with a simple drag and drop.

STemWin is distributed as part of STM32Cube software packages or in a standalone standard library-based version.

3

Start creating your own GUI

Select examples, watch demos, or start from scratch by importing graphical assets and use widgets in TouchGFX Designer to create your GUI application.

touchgfx designer walkthrough
TouchGFX walkthrough
 
4

Flash your design kit and run your smartphone-like GUI

With your developer kit connected to your PC, you just hit the “Run Target” and TouchGFX Designer will automatically use installed STM32Cube Programmer to flash to your kit.

An extended ecosystem to support your development

TouchGFX Implementers

Our dedicated and highly skilled TouchGFX Implementers help you move from idea to market-leading products. They bring you their innovative approach, combined with their extensive knowledge and experience with TouchGFX and STM32 microcontrollers, to help you design your next embedded product, and quickly move from idea to end-product.

edt logo
ektos logo
embedded partners logo
siana systems logo
mjolner logo
psicontrol logo

Display module makers

Avoid the hassle of sourcing your own display kit. Select a production-ready display module from one of our ST Authorized Partners and add it to your product.

These display modules all based on STM32, and TouchGFX is also available for your prototyping.

UI Tool providers

Several ST Authorized Partners provide GUI development tools for STM32 hardware. They are all committed to support you to ensure smooth GUI development on STM32.

crank software ametek logo
qt logo
embedded wizard logo
embedded wizard logo
00 Files selected for download
  Description Version Size Action
AN5051
Graphic memory optimization with STM32 Chrom-GRC™
1.0
736 KB
PDF
AN4996
Hardware JPEG codec peripheral in STM32F76/77xxx and STM32H7x3 line microcontrollers
1.0
721 KB
PDF
AN4860
DSI Host on STM32F469/479, STM32F7x8/x9 and STM32L4R9/S9 MCUs
2.0
13 MB
PDF
AN4323
Getting started with STemWin Library
5.0
1 MB
PDF
TouchGFX Brochure 1.0
4.7 MB
PDF
AN5051

Graphic memory optimization with STM32 Chrom-GRC™

AN4996

Hardware JPEG codec peripheral in STM32F76/77xxx and STM32H7x3 line microcontrollers

AN4860

DSI Host on STM32F469/479, STM32F7x8/x9 and STM32L4R9/S9 MCUs

AN4323

Getting started with STemWin Library

TouchGFX Brochure

Videos

New TouchGFX improves usability with a gauge widget and TouchGFX Designer upgrade