目录
ESP32-S3 移植 GUI-Guider 的打印机例程
前提准备
- esp-idf v4.4 开发环境 + VSCode 的 idf 插件 v1.4.0
- 带 ili9481 或其他屏幕的 esp32-s3(n8r16 或 n8r8) 开发板
- 已经移植的 lvgl(v7) 例程（见lv_port_esp32），以及你需要会移植（如何移植到esp32？）。
- GUI Guider 1.3.0
其实自带的例程就有这个打印机 demo，但是为了使用 GUI Guider，因此还是移植一遍这个。
关于工程模板以及移植好的工程，不会上传zip，有需要留言吧。
1. GUI Guider 生成工程
根据屏幕参数新建工程
注意文件路径不能含有中文和空格，项目名称必须以字母开头。长度必须至少为三个字符，只能包含字母、数字和下划线。
新建工程
界面改成中文
可以运行模拟器测试一下
模拟器界面
玩完了就可以直接生成代码了
生成完毕之后就可以用生成的代码了，主要用到这俩文件夹，在项目文件夹里面。
注意：先把 custom 复制到 generated 里面，然后复制 generated 到 移植好的 lvgl 例程里的 components 文件夹里，使生成的代码作为组件使用。
2.移植代码到 lvgl 例程里
关于组件
将生成的代码作为组件使用
用 VSCode 打开 lvgl 工程，生成的代码还不能直接作为组件使用，还需要一个 CMakeLists.txt 把代码包含在工程里面。在 generated 文件夹创建 CMakeLists.txt，其内容如下：
if(ESP_PLATFORM)
file(GLOB_RECURSE SOURCES *.c ./images/*.c ./guider_fonts/*.c ./custom/*.c)
idf_component_register(SRCS ${SOURCES}
INCLUDE_DIRS .
./guider_customer_fonts
./guider_fonts
./images
./custom
../lvgl
../lvgl/src/lv_core
../lvgl/src/lv_draw
../lvgl/src/lv_font
../lvgl/src/lv_gpu
../lvgl/src/lv_hal
../lvgl/src/lv_misc
../lvgl/src/lv_themes
../lvgl/src/lv_widgets
REQUIRES lvgl)
else()
message(FATAL_ERROR "LVGL LV examples: ESP_PLATFORM is not defined. Try reinstalling ESP-IDF.")
endif()
这个 CMakeLists.txt 是从 components\lv_examples 里复制的，根据 generated 所用到的代码添加内容。
其中../lvgl/src/lv_core以下的一长串只有../lvgl/src/lv_font是必须的，因为在components\generated\guider_fonts\guider_fonts.h里有#include "lv_font.h"，其他没啥用，注释掉也行，方便接别的移植工程复制这个 CMakeLists.txt。
与参考链接中的不同
在参考链接(ESP32 学习笔记 - ESP32 使用 GUI-Guider 制作 LVGL 图形界面)中，需要 lv_lib_split_jpg，但是本项目移植图片已经的全都是.c 文件了不需要把 jpg 转为 c 了。
参考链接中
6、然后再修改 main 文件夹里面的 CMakeLists.txt，把 generated 文件夹添加到编译环境里面，如下图所示。
实测并不需要，保持原样即可，像参考中那样做反而会报错。
调用生成的代码
在main\main.c中，注释掉原本运行的例程所包含的头文件：
包含生成的代码，注意lv_ui guider_ui;不能丢，在components\generated\gui_guider.h里声明了extern lv_ui guider_ui;，需要调用这个guider_ui：
#include "gui_guider.h"
#include "guider_lv_conf.h"
#include "guider_fonts.h"
#include "events_init.h"
lv_ui guider_ui;
然后注释掉原本运行的例程的 demo，并调用生成的代码：
/* 调用生成的代码 */
setup_ui(&guider_ui);
events_init(&guider_ui);
由于static void create_demo_application(void)声明了 static，使用需要注释掉它的声明和实现，不然在本文件中不调用create_demo_application的话编译器也会报错。
特别注意，这里有个反斜杠，这里也要注释！不然编译器会识别为多行注释报错。
除此之外，在components\generated\guider_lv_conf.h里生成了一些配置，由于之前移植的 lvgl 例程里面已经有了，如果这边再声明一遍会报错，因此通过#if 0和#endif注释掉整个文件就行了。
这时已经移植得差不多了，但是如果现在就编译的话还是会报错，主要是生成器生成的代码中包含 lvgl 头文件都是用这种形式#include "lvgl/lvgl.h"，不过该例程中实际上用的都是#include "lvgl.h"，生成器生成的文件这么多，怎么办呢？
其实也挺简单，首先在components\generated文件夹里打开一个新的 VSCode 窗口：
然后搜索#include "lvgl/lvgl.h"替换成
#ifdef LV_LVGL_H_INCLUDE_SIMPLE
#include "lvgl.h"
#else
#include "lvgl/lvgl.h"
#endif
就行了。
回到打开 lvgl 的窗口。
由于生成的例程有点大，需要大一点的 flash，需要改分区表，首先先编译一次以方便打开 sdk config。
现在编译肯定会报错空间不够。
关于分区表
随便从别的例程复制一个分区表partitions_example.csv到项目根文件夹：
partitions_example.csv 内容如下：
# Name, Type, SubType, Offset, Size, Flags
# Note: if you have increased the bootloader size, make sure to update the offsets to avoid overlap
nvs, data, nvs, 0x9000, 0x6000,
phy_init, data, phy, 0xf000, 0x1000,
factory, app, factory, 0x10000, 1M,
storage, data, fat, , 1M,
右键打开分区表编辑器：
根据报错内容把factory改大一点，这里改成 4M。
保存成功：
打开 sdk config 使用刚才的分区表：
改名，然后保存。
万事大吉，重新编译！
编译成功，烧录试试：
看看效果：
