Embedded GUI on STM32 Discovery Board with Littlev Graphics Library

In this post I will show you how I have ported the Littlev Graphical Library to an STM32 Discovery board. The porting was quite simple because the GUI library needs only a few interface functions. Although I’ve never used STM microcontrollers before the whole process took me only a half day. You can see the result in the video below.

I will show you how to port LittlevGL to STM Discovery but you can download a ready-to-use project as well: Project

To clone with git:

git clone https://github.com/littlevgl/stm32f429_disco_no_os_sw4stm32.git --recurse-submodules 

Or Download in Zip.

The development board

STM32 discovery development board (STM32F429I) with TFT display

Set-up a project

If you are not using the ready-to-use project here you can learn how to set up a new project from scratch.

I started with searching some code examples and I quickly found STM32CubeF4 which is the new, portable embedded software library of ST and it comes with a lot of examples. So downloaded it!

I was looking for an Eclipse based IDE and I’ve found SW4STM32. I had to register at openstm32.org to download the IDE. I was able to easily install the program and it worked fine with my Linux Mint operation system. The IDE is cross platform so is should work on Windows and OSX as well.

I have tried and reviewed some display related examples from the downloaded STM32CubeF4 pack using the Eclipse IDE. In this MCU the LCD controller modul is called LTDC (LCD TFT Display Controller). It also features with a graphical accelerator called Chrom-ART (aka DMA2D).

I began to create a new project in File/New/C Project and I chose Empty project with Ac6 STM32 MCU GCC tool chain and on a next page I have selected my board’s type. Finally I set that I would like to use Cube HAL. On the image below the “Download target firmware” button is inactive for me, however if it is active for you then you should click on it! As a result I get a project with lot of folders an files. I could build this initial project without any warning or error.

STM32 new project select toolchain

STM32 new project select board

STM32 new project select HAL drivers

To test in the development board I’ve written a simple LED blinker in the main function:

int main(void) {
	HAL_Init();
	BSP_LED_Init(LED3);
	
	while(1) {
	  BSP_LED_Toggle(LED3);
	  HAL_Delay(300);
	}
}

Port the Littlev Graphical Library

Using a terminal I’ve cloned the the lvgl repositories from the Littlev Graphical Library’s GitHub page. To do this go the project’s root folder and type the following command into a Terminal: git clone https://github.com/littlevgl/lvgl.git

To add the new directory firstly I right-clicked on the project name and chose Refresh. After that I’ve copied the lvgl/lv_conf_templ.h next to lvgl folder and renamed it to lv_conf.h. I’ve removed the #if 0 at the beginning and its #endifat the end to enable their content.

In lv_conf.h I’ve only changed:

After that I’ve done the porting of the display, touch pad and system tick according to the example programs. I’ve created hal_stm_lvgl folder and write the drivers in tft.c and touchpad.c. I added lv_tick_inc(1) to src/stm32f4xx_it.c -> SysTick_Handler()

In main.c I called lv_init(), tft_init() and touchpad_init(). I was able to compile the project and load it to the board.

Finally also added the lv_examples repository and called demo_create(). It created a GUI can be seen on the video above.

Summary

In summary I can say the STM32 Discovery board is a great, powerful and low-cost development board which can be a good starting point for your first GUI application! With Littlev Graphics Library you can create a modern and innovative graphical user interfaces on it. By following this guide you can easily get through the first steps!