CMake

How to build and integrate the CMake project that the LVGL Pro Editor generates when you export C code.

Overview

When you export C code, the Editor generates a small set of CMake files next to your UI so it can be dropped into any CMake-based build. The exported code is built as a library target called lib-ui that you link into your application.

Adding the UI to your project

The generated CMakeLists.txt expects an lvgl target to already exist so it can link against it and use its lv_conf.h. In your application's CMake, create/fetch LVGL first, then add the exported UI folder and link lib-ui:

# 1. Make an `lvgl` target available (FetchContent, add_subdirectory, a package, ...)
include(FetchContent)
FetchContent_Declare(lvgl
  GIT_REPOSITORY https://github.com/lvgl/lvgl.git
  GIT_TAG v9.5.0)
FetchContent_MakeAvailable(lvgl)

# 2. Add the exported UI. It builds a `lib-ui` target.
add_subdirectory(ui)

# 3. The generated code uses `#include "lvgl.h"`, so enable simple includes.
target_compile_definitions(lib-ui PUBLIC LV_LVGL_H_INCLUDE_SIMPLE)

# 4. Link it into your application.
target_link_libraries(my_app PRIVATE lib-ui lvgl)

If the UI folder is outside your source tree, give add_subdirectory a binary dir:

add_subdirectory(${UI_DIR} ${CMAKE_BINARY_DIR}/ui)

lib-ui exports the UI folder as a public include directory, so your application can include the generated header and call the init function:

#include "my_project.h"   /* "<project name>.h" from project.xml */

my_project_init("A:ui");  /* asset path for file-based images/fonts */
lv_screen_load(home_create());

Adding your own source files

To compile your own .c files alongside the UI (for example custom widgets or event-handler code), list them in user_config.cmake. This file is included by the generated CMakeLists.txt and is never overwritten:

list(APPEND LV_EDITOR_PROJECT_SOURCES
    ${CMAKE_CURRENT_LIST_DIR}/src/my_widget.c
    ${CMAKE_CURRENT_LIST_DIR}/src/my_screen.c
)

Use ${CMAKE_CURRENT_LIST_DIR} so the paths are relative to user_config.cmake. Your sources are compiled into the same lib-ui target and can use LVGL directly.

Building standalone

If you configure the exported folder itself as the CMake source directory, it detects that it is top-level (project(LVGLProject)) and builds lib-ui on its own. This is mainly useful as a quick compile check — because it only produces the library, there is no executable to run. To actually run the UI, integrate it into an application as shown above, or use one of the ready-made projects such as the VS Code project, simulator, Linux project, or Zephyr project, which already provide the LVGL target and an entry point.