GUI Guider is a user-friendly graphical user interface development tool from NXP that enables the rapid development of high quality displays with the open-source LVGL graphics library.
GUI Guider can also export projects using Zephyr. The document GUIGuider_User_Manual installed with GUI Guider has a section working with Zephyr, and provides steps using Command Line Interface (CLI). This article is an example using NXP's MCUXpresso extension for VS Code to import the generated project, build and download to a board.
Requirements
The steps in this article are based on these requirements:
- Software:
- GUI Guider v1.10.0-GA
- Zephyr v4.0.0 - the GUI Guider release notes say support is based on "Zephyr v4.0 support for LVGL v8.3.10"
- Zephyr SDK v0.17.0 - the Zephyr SDK version tested with Zephyr v4.0.0
- MCUXpresso extension for VS Code v25.9.49
- Hardware:
- MIMXRT595-EVK evaluation board for the i.MX RT500
- G1120B0MIPI display shield
Zephyr Pre-Requisites
This GUI Guider release requires an older version of Zephyr v4.0.0. If the Zephyr repo is already imported in VS Code, the MCUXpresso extension can checkout the required version.
Click the MCUXpresso extension, right-click the Zephyr repo to update, and click "Update Repository or Index"
A pop-up appears in the lower right corner. Click the Custom button to select the release tag
A pull-down appears at the top center. Select the v4.0.0 release tag. This will take some time for the extension to checkout this version, and run "west update" to sync all the module repositories.
If the Zephyr repo needs to be imported for the first time, the v4.0.0 version can be selected during the import. Use the Quickstart Panel in the extension to "Import Repository". For more help getting started with the MCUXpresso extension and importing Zephyr, see the NXP Zephyr Knowledge Hub.
- Repository: Zephyr
- Revision: select v4.0.0
Create and Export GUI Guider project
Open GUI Guider and start a new project.
- Select LVGL8.3.10 because the GUI Guider release notes say this is the LVGL version supported with Zephyr v4.0.0.
- Select the board MIMXRT595-EVK
- Select the application SmartWatch
- Create the project
Generate the C code for the project:
Export the code for Zephyr:
Exporting the project into the Zephyr repository is the easiest option to import that project into VS Code.
- In this example, the Zephyr workspace was setup in C:\z\zephyrproject.
- The project folder name we will export is gui_guider_demo, and place in the samples folder
- Then the full path for this exported project is C:\z\zephyrproject\zephyr\samples\gui_guider_demo
Import GUI Guider project into VS Code
Back in VS Code, in the MCUXpresso extension, refresh the repository to find the newly generated sample project:
In the Quickstart Panel, "Import Example from Repository" with these settings:
- Repository: your Zephyr v4.0.0 workspace
- Board: mimxrt595_evk//cm33
- Template: search "gui", and select the exported gui_guider_demo
- App type: Repository application
- Zephyr SDK: since this is an older Zephyr release, be sure to use the older Zephyr SDK v0.17.0, otherwise the app may not build
After importing, we also need to add the display shield to the project. This is done by adding a Cmake variable, see the MCUXpresso Cmake wiki for more details. In the gui_guider_demo project, click the Edit button for the debug build configuration.
Add the shield name to the CMake Extra arguments using this line, and click the Save button:
SHIELD="g1120b0mipi"
Apply GUI Guider patches
GUI Guider includes git patches in the exported project, and GUIGuider_User_Manual provides steps for apply these patches to the Zephyr and LVGL repositories. Applying these patches uses CLI, and this article leverages a CLI feature in the MCUXpresso extension.
Right-click the gui_guider_demo project, and select "Open in Integrated Terminal". This opens the CLI terminal in the project folder, and activates the Python virtual environment.
Enter these CLI commands to apply the patches:
cd ../..
git apply samples\gui_guider_demo\patches\0001-zephyr-Add-build-support-for-new-lvgl-widgets-develo.patch
cd ..\modules\lib\gui\lvgl
git apply ..\..\..\..\zephyr\samples\gui_guider_demo\patches\0001-lvgl-Add-new-widgets-developed-by-NXP.patch
Update Kconfig settings
Some of the Kconfig settings in the exported project do not work for this board and application, and the sizes must be increased. The sizes used here come from the LVGL demo in the Zephyr repo from the file samples/modules/lvgl/demos/prj.conf. For an introduction to Kconfig, see the NXP Zephyr Lab MCXN947 Kconfig.
In the exported gui_guider_demo project, open the project file prj.conf.
Update the first two Kconfig settings with these sizes:
CONFIG_LV_Z_MEM_POOL_SIZE=49152
CONFIG_MAIN_STACK_SIZE=4096
Build and flash the project
The project is now ready to build. Right-click the project and do a Pristine Build
When the build completes, click the debug icon to program the image to flash. The app is a very large image and will take some time to program.
Now the LVGL application generated by GUI Guider runs on the target board.
Return to Zephyr Knowledge Hub
