文章目录
1. 硬件配置
1.1 ESP32 + TFT 彩屏
-
本篇中的 ESP32 和 TFT 彩屏参见前两篇博客:
-
接线也参考上两篇细节。
1.2 触摸屏的参数标定
- 参数标定及触摸屏测试例程见第三篇:
1.3 参考资料
- 本篇大量参考该博客 《ESP32 学习笔记》之 Arduino环境下玩转 LVGL-搭建环境 。
2. LVGL 开发环境
最好的指南就是官方文档 https://docs.lvgl.io/master/get-started/arduino.html#get-the-lvgl-arduino-library
2.1 LVGL 在 Arduino 中安装
-
可以参考官方步骤,目前 Arduino 库中的 lvgl 已经是
v8.2
版本,这里我直接从 Arduino 中安装。 -
在 Library Manager 中搜索
lvgl
如下: -
注意这里搜索会出来三个相关的库,第一个是 lvgl 在 arduino 上的专用库,lvgl 的大版本是
7
,github 链接在这 - lv_arduino,官方声明这个库已经过时了,如果想使用7.X
版本的 lvgl 也可以用这个,本文直接用最下面的lvgl
并选择version 8.2.0
进行安装。
2.2 配置 LVGL 参数头文件 lv_conf.h
-
在 home/Arduino/libraries 下进入 lvgl 文件夹,将
lv_conf_template.h
拷贝到文件夹外,并重命名为lv_conf.h
,打开该文件将第15行的#if 0
改为#if 1
。 -
第 27 行,根据设备设置颜色深度
#define LV_COLOR_DEPTH 16
。 -
第 88 行,改为
#define LV_TICK_CUSTOM 1
。 -
最后
lv_conf.h
的文件应跟其他库并列arduino |-libraries |-lvgl |-other_lib_1 |-other_lib_2 |-lv_conf.h
-
注意
lv_conf.h
中第 672 ~ 694 行 是 lvgl 例子相关的设置,如果设为 1 方可编译该例子,详见下一小节。
2.3 测试 LVGL 基本例程
-
在 File - Examples - lvgl - arduino 中选择
LVGL_Arduino
例程,该程序中集合 lvgl 自带的很多例程,与其他库一个个独立的例程不用,该例程中通过调用已经定义好的例程函数来测试不同特性,关键代码如下:void setup() { Serial.begin( 115200 ); /* prepare for possible serial debug */ // 中间省略 #if 0 /* Create simple label */ 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 ); #else //lv_example_btn_1(); //lv_example_anim_1(); lv_example_get_started_3(); // uncomment one of these demos //lv_demo_widgets(); // OK // lv_demo_benchmark(); // OK // lv_demo_keypad_encoder(); // works, but I haven't an encoder // lv_demo_music(); // NOK // lv_demo_printer(); //lv_demo_stress(); // seems to be OK #endif Serial.println( "Setup done" ); }
-
上述代码为
LVGL_Arduino
例程中的setup()
函数,其中#if 0
如果设为 1 可以测试 lvgl 最基础的标签例子,下面我们先将其设为 1 进行编译测试。点击编译后提示如下错误,找不到lv_demo.h
这个文件。LVGL_Arduino:9:21: fatal error: lv_demo.h: No such file or directory
-
然而 lvgl 源码里没有这个文件,但是在 demos 路径下有一个
lv_demos.h
多一个 s ,该路径下的 README.md 中解释到,如果编译器没有添加所有源文件,那么需要自己手动 include 一下这个lv_demos.h
。//If your development environment or toolchain does not add source files inside '***lvgl***' folder automatically, ensure the `demos` folder is included for compilation. //Include "***demos/lv_demos.h***" in your application source file, for example: #include "lvgl.h" #include "demos/lv_demos.h"
-
我们用这句
#include "demos/lv_demos.h"
替换掉#include <lv_demo.h>
,再次编译,又报错如下,这回又找不到demos/lv_demos.h
文件。LVGL_Arduino:9:28: fatal error: demos/lv_demos.h: No such file or directory
-
实际上,这是 arduino 编译器的问题,在 lvgl 官方文档 Arduino 篇的 Use the examples and demos 这部分,官方特意强调了一点如下。也就是说需要把 lvgl 路径下的
examples
和demos
两个文件夹拷贝到lvgl/src
下。 -
执行一下拷贝工作后再次编译,这次编译没有报错,直接烧录程序(别忘了给串口权限),最终显示效果如下:
3. 简洁版 lvgl 配置流程 (Arduino)
-
在 arduino 的 Library Manager 中搜索
lvgl
并安装 v8.x 最新版。 -
在 home/Arduino/libraries 下进入 lvgl 文件夹,将
lv_conf_template.h
拷贝到文件夹外,并重命名为lv_conf.h
,打开该文件:- 第 15 行,
#if 0
改为#if 1
。 - 第 27 行,根据设备设置颜色深度 ``#define LV_COLOR_DEPTH 16`。
- 第 88 行,改为
#define LV_TICK_CUSTOM 1
。
- 第 15 行,
-
仍然在 lvgl 文件夹中,把
examples
和demos
两个文件夹拷贝到lvgl/src
下。 -
在 File - Examples - lvgl - arduino 中选择
LVGL_Arduino
例程,修改顶部的包含代码:- 用这句
#include "demos/lv_demos.h"
替换掉#include <lv_demo.h>
-
LVGL_Arduino
例程第 114 行附近,修改 setup() 函数中/* Create simple label */
这句上面的#if 0
,改为#if 1
。
- 用这句
-
编译并烧录至 ESP32,注意以上步骤的前提是你的 TFT_eSPI 库已经在 arduino 中配置好了,详见顶部前三篇博客。
-
LVGL 库中自带了很多例子,需要在
LVGL_Arduino
例程中打开相应函数的注释,下一篇博客记录测试不同例子的流程。