本帖最后由 muyichuan2012 于 2025-3-19 17:46 编辑
#申请原创# AT32移植LVGL V9.2.2并使用NXP GUI Guider设计UI界面 一、概述 本文描述了NXP GUI Guider从安装到使用的具体步骤
本文移植了LVGL V9.2.2到AT32F437和AT32F403A
具体使用的板子为AT-SURF-F437 V1.0和AT-START-F403A + TFT LCD Touch Demo Board v1.0 + ALIENTEK 4.3 TFTLCD,相关板子资料可到雅特力官网下载
二、GUI Guider简介 开发背景 针对LVGL图形库在UI工具方面的不足,恩智浦于2021年初推出GUI-Guider,主要用于帮助开发者快速创建和设计基于LVGL框架的用户界面 技术基础 基于开源LVGL框架(MIT协议),兼容C/C++语言,提供丰富的图形组件和动画效果,适用于资源受限的MCU环境。 软件获取 1.官网下载:打开网址搜索GUI Guider,选择适合自己的系统的版本下载安装,https://www.nxp.com.cn/ 2.百度云盘:链接: https://pan.baidu.com/s/1cWSpqlga-vfcK81EyfsQXg 提取码: 5bzj
三、GUI Guider核心功能 可视化设计 提供拖拽式编辑器,支持创建多屏幕布局、调整控件属性及动画效果,开发者无需手动计算坐标位置即可完成界面设计 资源管理 内置资源管理器,支持导入自定义图片、字体及图标,并自动优化资源存储结构 代码生成 设计完成后,可一键生成与LVGL兼容的C代码,适用于模拟器和嵌入式设备 多种屏幕规格 用户可以根据硬件屏幕规格选择合适的设备面板,并生成相应的代码
三、GUI Guider安装和使用步骤 1.双击安装包,安装软件,选择“中文(简体)”,然后点击“OK”
2. 点击“我同意”
3.选择安装方式,然后再点击“下一步”
4.设置安装目录,点击“安装”
5.等待安装完成
6.点击“完成”
7.登录NXP账号,如果没有NXP账号,可以点击下方“CREATE AN ACCOUNT”申请账号
8.点击“NEXT”
9. 点击“NEXT”
10. 总共有12个调查问卷,填写好了就点击“NEXT”
11.填写完成后点击“Done”
12.填写完成
13.新建工程,点击“Createaa new project”
14.选择V9.2.1,点击“Next”
15.选择“Simulator”,点击“Next”
16.选择EmptyUI,点击“Next”
17.设置工程参数 1)Project Name:工程名字 2)Project Directory:工程保存路径 3)Color Depth:颜色深度 4)Panel Type:屏幕尺寸,我这里选的用户自定义 5)屏幕尺寸设置,根据实际设置 6)点击“Create”,完成工程设置
18.另外屏幕尺寸也可以选择软件自带的
19.工程设置好后显示此界面
20. 1)点击“English” 2)设置语言为中文 3)点击此图标,展开控件栏
21.点击此图标,完全展开控件
22.依次点击“按钮”和“滑动条”,会自动放到右边屏幕上,鼠标可以调整两个控件的位置和大小
23.代码生成:选择C编译,开始编译代码
24.点击“确认”
25.等待编译完成后,会自动弹出模拟器,然后可以通过鼠标点击按钮,拖动滑块,模拟实际操作
26.将生成的代码移植到MCU上,我们之前设置工程路径下在编译完成后会生成一个“generated”文件夹,我们需要移植此文件夹
27. 将“generated”文件整体拷贝到AT32的工程下面
28.需要将“generated”文件夹的所有.c、.h文件添加到KEIL工程里
29. 将所有.c添加到KEIL工程里
30. 将所有.h路径添加到KEIL工程里
31.屏蔽“setup_src_screen.c”如下位置代码
32.修改“main.c”如下位置代码
33.编译整个工程
34.下载程序到AT-SUFR-F437板子上,即可看到和模拟器上相同的界面
35. 同样的流程,配置AT32F403A工程,下载到板子上,即可看到和模拟器上相同的界面
36.上述代码已经打包好放入附件,具体内容介绍如下
|