ESP32开发-LVGL显示图片

图片使用方式

LVGL中可以使用两种方式显示图片
1、作为内部存储器（RAM 或 ROM）中的变量
2、作为文件

---

内部读取图片

优点：数据跟代码一起编译成固件，使用方便。
缺点：图片需要用工具转化成数组形式，图片过多或者图片分辨率过大时可能会出现编译错误（常量数据超出DROM）。

使用方法跟外部字体库类似，使用工具将图片转为成一个 .c 文件，文件里会有存储图片数据的常量数组和 LVGL 的图片数据类型结构体，同时结构体变量即可使用图片。

const lv_img_dsc_t test = {
  .header.always_zero = 0,
  .header.w = 225,
  .header.h = 113,
  .data_size = 25425 * LV_COLOR_SIZE / 8,
  .header.cf = LV_IMG_CF_TRUE_COLOR,
  .data = test_map,
};

通过 LVGL api 即可显示图片

lv_obj_t * icon = lv_img_create(lv_scr_act(), NULL);
/*From variable*/
LV_IMG_DECLARE(test );
lv_img_set_src(icon, &test );

如果图像是使用在线或者工具转换器转换的，则应使用 LV_IMG_DECLARE(my_icon_dsc) 该图像在文件中声明要使用的位
置。

//相当于extern
#define LV_IMG_DECLARE(var_name) extern const lv_img_dsc_t var_name;

---

外部读取图片

外部图片有两种存储方式

1、作为png、jpg等图片格式

需要用SD卡等存储设备存储图片，同时也需要对图片进行解码，LVGL有提供图片解码API（应该只支持部分格式解码，例如PNG）

lv_res_t res;
lv_img_decoder_dsc_t dsc;
res = lv_img_decoder_open(&dsc, &my_img_dsc, LV_COLOR_WHITE);
if(res == LV_RES_OK) {
 /*Do something with `dsc->img_data`*/
 lv_img_decoder_close(&dsc);
}

2、作为bin文件

当图片作为bin文件读取时，需要esp32运行文件系统，具体可以参考ESP-IDF demo中的spiffs。

此外，还需要实现 lvgl 文件系统中的文件操作函数。具体文件参考下图。

作为二进制文件时，bin文件可以指定所需的颜色格式：
RGB332 用于 8 位色深
RGB565 用于 16 位色深
RGB565 交换为 16 位颜色深度（交换了两个字节）
RGB888 用于 32 位色深

lv_obj_t * icon = lv_img_create(lv_scr_act(), NULL);
/*From file*/
lv_img_set_src(icon, "S:test.bin");