LVGL耳机舱新增界面方法

📎 原始文档：https://www.kdocs.cn/l/cf4i5qkh9TS7 LVGL耳机舱新增界面方法

  1. 编辑gui guider工程

安装gui guider

版本是1.6.1,下载链接：https://www.nxp.com.cn/webapp/Download?colCode=GUI-GUIDER-SETUP-1.6.1-GA-WIN&appType=license&location=null

导入ui工程

UI工程是单独给的，不在sdk文件夹里，需要问杰理要
image

导入图片资源

将使用的图片放入NXP_320x172_公版_V201\earphone_flash\earphone\import\image 文件夹
image

使能图片资源外置

在gui guider打开工程编辑，注意图片内置的话是const数组的形式，会占用app的空间，外置是存储在ui.res里，可以放到外置flash，布局完后，点击生成c，就会自动生成布局代码
image

  1. lvgl生成的代码和资源兼容杰理sdk

复制生成代码

去generate文件夹将set开头的界面名字命名的.c文件复制到工sdk里的generated文件夹下，然后对比标记的这几个.c和.h（evens_init.h gui_guider.h等）的差异，将生成的部分复制过去
image

外置flash生成资源文件

将图片资源放到sdk目录的lv_charging_case\res-pack-tools\imb-rle-pack\imbtools\images\320x172下边，注意不是UI工程目录
在这个目录下可以自己再建立一个文件夹，脚本会遍历所有文件夹提取图片，比如这里我们新增了slide_unlock
点击run生成资源文件和资源索引即可
image

生成makefile

回到上级目录，运行这个脚本，生成makefile
image

修改生成的代码，兼容sdk

这里要改一下接口的形参，才能在杰理sdk使用，注意同步到.h文件
image

添加自定义功能

如果要给页面新增触摸事件或者效果，我们需要新建一个文件夹，然后新建.c与.h，具体内容参考这个文件夹里的文件
image