代码收藏家 ESP32 Arduino中lvgl移植和使用教程
一、简介
LVGL全程LittleVGL，是一个轻量化的，开源的，用于嵌入式GUI设计的图形库。并且配合LVGL模拟器，可以在电脑对界面进行编辑显示，测试通过后再移植进嵌入式设备中，实现高效的项目开发。
SquareLine Studio是LVGL官方推荐的UI设计平台，可以便捷地设计界面并一键生成代码导出。导出的代码在模拟器和嵌入式设备上都适用。目前支持的LVGL版本为8.2和8.3。对个人而言，注册即可免费使用。
官方地址：SquareLine Studio
二、platformio 移植
1 PlatformIO下载LVGL库
在PlatformIO库中直接搜索LVGL库添加到工程
（ps：因为这里下载的v8.1.0版本没有lv_demos，若需要运行例程可以自己再下载一个，不过注意下载完后需要lv_demo_conf_template.h改成lv_demo_conf.h，要不然不能编译）
2 修改文件名
lvgl_config_template.h修改为lvgl_config.h
#if 0 的0改为1
这时候就可以编译了（否则编译报错）
3 移植显示驱动
添加TFT_eSPI库
定义彩屏引脚（在User_Setup.h文件里）
配置文件修改
在User_Setup.h文件中选择取消注释你需要的驱动文件
修改分辨率
（ps：LVGL的长宽设置是横着来看的，原本TFT库的是竖着来看的，所以这里长宽需要反过来，当然视具体情况而定）
其他就不说了，具体修改如下
#define ST7789_DRIVER
//色彩
#define ESP32_DMA
#define TFT_RGB_ORDER TFT_BGR
#define TFT_INVERSION_OFF
//分辨率
#define TFT_WIDTH 240
#define TFT_HEIGHT 240
//管脚
#define TFT_MISO 19
#define TFT_MOSI 23
#define TFT_SCLK 18
#define TFT_CS 5 // Chip select control pin
#define TFT_CS -1
#define TFT_DC 27 // Data Command control pin
#define TFT_RST 26 // Reset pin (could connect to RST pin)
//字体
#define SMOOTH_FONT
//SPI速率
#define SPI_FREQUENCY 40000000
#define SPI_READ_FREQUENCY 6000000
测试代码：
#include <Arduino.h>
#include <lvgl.h>
#include <TFT_eSPI.h>
static lv_disp_draw_buf_t draw_buf; //定义显示器变量
static lv_color_t buf[TFT_WIDTH * 10]; //定义刷新缓存
TFT_eSPI tft = TFT_eSPI();
/* Display flushing */
void my_disp_flush(lv_disp_drv_t *disp, const lv_area_t *area, lv_color_t *color_p)
{
uint32_t w = (area->x2 - area->x1 + 1);
uint32_t h = (area->y2 - area->y1 + 1);
tft.startWrite(); //使能写功能
tft.setAddrWindow(area->x1, area->y1, w, h); //设置填充区域
tft.pushColors((uint16_t *)&color_p->full, w * h, true); //写入颜色缓存和缓存大小
tft.endWrite(); //关闭写功能
lv_disp_flush_ready(disp); //调用区域填充颜色函数
}
void setup()
{
tft.init(); //初始化
tft.setRotation(3); //屏幕旋转方向（横向）
lv_init();
lv_disp_draw_buf_init(&draw_buf, buf, NULL, TFT_WIDTH * 10);
/*Initialize the display*/
static lv_disp_drv_t disp_drv;
lv_disp_drv_init(&disp_drv);
/*Change the following line to your display resolution*/
disp_drv.hor_res = TFT_WIDTH;
disp_drv.ver_res = TFT_HEIGHT;
disp_drv.flush_cb = my_disp_flush;
disp_drv.draw_buf = &draw_buf;
lv_disp_drv_register(&disp_drv);
/*获取LVGL版本信息*/
String LVGL_Arduino = "Hello LVGL! ";
LVGL_Arduino += String('V') + lv_version_major() + "." + lv_version_minor() + "." + lv_version_patch(); //版本
lv_obj_t *label = lv_label_create(lv_scr_act());
lv_label_set_text(label, LVGL_Arduino.c_str());
lv_obj_align(label, LV_ALIGN_CENTER, 0, 0); //居中显示
}
void loop()
{
lv_timer_handler(); /* let the GUI do its work */
delay(5);
}
4 使用SquareLine Studio生成ui代码
（1）打开创建工程界面
这里可以看到SquareLine Studio可以直接选择Arduino的tft_espi库的接口，这大大方便了我们的移植。
（2）设置屏幕参数
（3）设计UI界面
（4）生成代码
选择Export-Export UI Files导出项目文件，并将该文件夹放置到platform项目中的lib文件目录下
有时候会报一些配置的错误 ，直接排除就好。因为有时候你的屏幕没有触摸功能，但是你的UI有，并且生成了代码，就会报错。
测试代码
#include <Arduino.h>
#include <lvgl.h>
#include <TFT_eSPI.h>
#include "ui.h"
static lv_disp_draw_buf_t draw_buf; //定义显示器变量
static lv_color_t buf[TFT_WIDTH * 10]; //定义刷新缓存
TFT_eSPI tft = TFT_eSPI();
/* Display flushing */
void my_disp_flush(lv_disp_drv_t *disp, const lv_area_t *area, lv_color_t *color_p)
{
uint32_t w = (area->x2 - area->x1 + 1);
uint32_t h = (area->y2 - area->y1 + 1);
tft.startWrite(); //使能写功能
tft.setAddrWindow(area->x1, area->y1, w, h); //设置填充区域
tft.pushColors((uint16_t *)&color_p->full, w * h, true); //写入颜色缓存和缓存大小
tft.endWrite(); //关闭写功能
lv_disp_flush_ready(disp); //调用区域填充颜色函数
}
void setup()
{
tft.init(); //初始化
lv_init();
lv_disp_draw_buf_init(&draw_buf, buf, NULL, TFT_WIDTH * 10);
/*Initialize the display*/
static lv_disp_drv_t disp_drv;
lv_disp_drv_init(&disp_drv);
/*Change the following line to your display resolution*/
disp_drv.hor_res = TFT_WIDTH;
disp_drv.ver_res = TFT_HEIGHT;
disp_drv.flush_cb = my_disp_flush;
disp_drv.draw_buf = &draw_buf;
lv_disp_drv_register(&disp_drv);
ui_init();
}
void loop()
{
lv_timer_handler(); /* let the GUI do its work */
delay(5);
}
