GUI Guider设计UI界面移植到STM32

本文介绍GUIGuider——一款用于LVGL的GUI设计工具,支持通过拖放方式快速设计UI界面,并能在PC上进行仿真。文章详细讲解了如何使用GUIGuider设计UI界面、生成C代码并最终移植到STM32平台的过程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

GUI Guider设计UI界面移植到STM32

一、什么是GUI Guider

什么是 GUI-Guider? GUI Guider 是恩智浦为 LVGL 开发了一个上位机GUI 设计工具,可以通过拖放控件的方式设计 LVGL GUI 页面,加速 GUI 的设计。 设计完成的 GUI 页面可以在 PC 上仿真运行,预览自己设计的UI界面。确认设计完毕之后可以生成 C 代码,再整合到 MCU 项目中。
软件下载地址:https://www.nxp.com.cn/
打开网址搜索GUI Guider选择适合自己的系统的版本。下载安装。

二、软件使用

打开软件
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
选择自己喜欢的图片,但是在选择图片时要注意图片大小,可以通过图片编辑工具调整图片大小已适应我们的屏幕大小。
运行仿真,选择C语言
仿真效果
在这里插入图片描述
点击生成代码。

三、将代码整合到我们的工程

打开我们刚才的GUI工程目录,下面有一个 generated 文件夹,该文件夹就是我们所需要的,将generated整个文件夹复制到我们的STM32工程中的GUIAPP目录下。
接着打开keil工程在keil工程添加相关的.c源文件和.h头文件路径。
添加.c文件
在这里插入图片描述
包含文件路径
在这里插入图片描述
然后编译,可能会报错,双击第一条错误提示
在这里插入图片描述
接着继续修改其他类似错误。再次编译可能会提示找不到 “lv_font.h” 头文件,记得我们之前在LVGL源码是遇到有这个,所以我们这里把GUI/src路径下的font文件夹路径包含进来。

再次编译,会提示找不到"custom.h"头文件,这里我们把它注释掉。最后编译通过。有时候到这一步会有 error: #8: missing closing quote 这样的错误提示,
解决办法就是:在KEIL中Options for Target ‘Flash’ -> C/C++ -> Misc Controls添加“–locale=english”。
在这里插入图片描述
然后再main.c 源文件中添加相关的头文件和代码。
在这里插入图片描述
编译下载到板子上,可以看到程序运行屏幕显示我们自己设计的UI界面。

GUI Guide (图形用户界面向导) 是一种库或软件包,它通常用于嵌入式系统如STM32微控制器,帮助创建用户界面并管理硬件控制。对于将GUI Guide移植STM32,你需要做以下几个步骤: 1. **环境配置**:首先,确保你在STM32上安装了必要的开发工具链,如Keil MDK、STM32CubeIDE等,并配置好相应的SDK库。 2. **集成库文件**:下载并解压GUI Guide库,将其包含头文件和源文件添加到你的项目工程中。确保链接相关的库文件,比如图形绘制和内存管理库。 3. **初始化硬件**:设置GPIO作为输出,连接至LED灯,然后编写代码来初始化这些GPIO并配置它们为推挽模式以便驱动LED。 4. **GUI绑定**:将GUI组件(如开关)与其对应的硬件(LED)关联起来。这通常涉及到为每个GUI元素设置点击或状态改变事件处理器。 5. **处理事件**:在案例代码中,当你检测到开关的状态更改(`LV_EVENT_VALUE_CHANGED`),根据GUI Guide提供的API,更新与开关关联的LED状态。 ```c void onSwitchValueChanged(lv_event_t *e) { LV_OBJ *obj = lv_event_get_target(e); if (!obj || obj != ui->switch_1) return; bool isChecked = lv_obj_get_state(obj) == LV_STATE_CHECKED; toggleLED(isChecked); // 自定义函数来切换LED状态 } // 示例中toggleLED函数可能类似这样 void toggleLED(bool state) { if (state) { GPIO_SetPinHigh(LED_GPIO_PIN); // 高电平点亮LED } else { GPIO_SetPinLow(LED_GPIO_PIN); // 低电平关闭LED } } ``` 6. **错误处理和调试**:确保在整个过程中进行充分的错误检查和调试,包括硬件通信错误、内存管理错误以及GUI库的错误。
评论 7
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值