【物联网初探】- 05 - ESP32 上 LVGL 库的多个例程测试 (Arduino IDE)

1. 硬件、接线、环境配置

• 【物联网初探】- 01 - ESP32 开发环境搭建 (Arduino IDE)

• 【物联网初探】- 02 - ESP32 利用 SPI 联通 TFT 彩屏 (Arduino IDE)

• 【物联网初探】- 03 - ESP32 结合 TFT_eSPI 库标定 TFT 触摸屏 (Arduino IDE)

• 【物联网初探】- 04 - ESP32 结合 LVGL 库开发环境搭建 (Arduino IDE)

2. LVGL 库下的例程测试

在 LVGL_Arduino 例程中的 setup 函数内注释了几个比较完整的例程，下面逐个进行测试。

2.1 lv_demo_widgets()

• 首先看一下这部分的代码，如果是从上一篇博客来的，需要把 #if 1 再改回 0 然程序进入 #else 逻辑。

  #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();
      // 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
  

• 首先去掉 lv_demo_widgets(); 的注释，但是仅这样还不行，需要修改 lv_conf.h 中的宏定义来开启例程，打开 lv_conf.h ，大致在 667 行，关键部分如下，为了测试例程，需要将这些标志设为 1 ，首先我们把 #define LV_USE_DEMO_WIDGETS 设为 1。

  /*===================
   * DEMO USAGE
   ====================*/
  
  /*Show some widget. It might be required to increase `LV_MEM_SIZE` */
  #define LV_USE_DEMO_WIDGETS        0
  #if LV_USE_DEMO_WIDGETS
  #define LV_DEMO_WIDGETS_SLIDESHOW  0
  #endif
  
  /*Demonstrate the usage of encoder and keyboard*/
  #define LV_USE_DEMO_KEYPAD_AND_ENCODER     0
  
  /*Benchmark your system*/
  #define LV_USE_DEMO_BENCHMARK   0
  
  /*Stress test for LVGL*/
  #define LV_USE_DEMO_STRESS      0
  
  /*Music player demo*/
  #define LV_USE_DEMO_MUSIC       0
  #if LV_USE_DEMO_MUSIC
  # define LV_DEMO_MUSIC_SQUARE       0
  # define LV_DEMO_MUSIC_LANDSCAPE    0
  # define LV_DEMO_MUSIC_ROUND        0
  # define LV_DEMO_MUSIC_LARGE        0
  # define LV_DEMO_MUSIC_AUTO_PLAY    0
  #endif
  

• 注意在程序的 93 行附近，替换你自己的 TFT 触摸屏标定参数，编译后烧录好的例程如下所示，能够看出来，触摸交互都没问题，但是 FPS 是很低了，目前我也不太清楚为什么这么卡，大概率还是板子的性能太低了，而绘制的图元太多了。

esp32 上 LVGL 库中例程 lv

2.2 lv_demo_benchmark()

• 与上面例程的流程一致，先去修改 lv_conf.h 中的宏定义来开启例程 #define LV_USE_DEMO_BENCHMARK 1，然后把程序内的注释打开。

• 编译测试结果如下，同样，基准测试显示的 FPS 只有 3 左右。

esp32 上 LVGL 库中例程 lv

2.3 lv_demo_keypad_encoder()

• 老样子，还是上面的流程，先去修改 lv_conf.h 中的宏定义来开启例程 #define LV_USE_DEMO_KEYPAD_AND_ENCODER 1，然后把程序内的注释打开。

• 编译测试结果如下：

esp32 上 LVGL 库中例程 lv

2.4 lv_demo_music()

• 老样子，还是上面的流程，先去修改 lv_conf.h 中的宏定义，把 music 下面的全改为 1 ，这里编译报错了，简要摘出来如下：

  error: 'lv_font_montserrat_16' undeclared (first use in this function)
  error: 'lv_font_montserrat_22' undeclared (first use in this function) 
  error: 'lv_font_montserrat_32' undeclared (first use in this function)                                ^
  

• 错误原因就是缺一些字体的定义，回到 lv_conf.h 中搜索下面对应的字体宏定义，改为 1 ，这回编译可以，但是报错说板子内存不够，代码太大了，这个例程就不搞了，可以参考官网的模拟效果。

2.5 lv_demo_printer()

• 直接报错 'lv_demo_printer' was not declared in this scope ，上源码找了一圈，v8 的 lvgl 文件夹中干脆没这个例子，也先不搞了。

2.6 lv_demo_stress()

• 一样的流程，先去修改 lv_conf.h 中的宏定义，编译上传成功，但是屏幕的位置显示是错乱的，类似下图。

  

2.7 小结

• 几个比较大的例子测试下来发现，整体的 UI 效果很棒，但是有些例子跑不起来，所有例子都很卡，咱也没有优化的能力，这种大例子可能害得更好的板子性能才跑得顺滑，下面测试测试基本特性，后续开发的话，看这个 FPS ，基本也跟滚动页面告别了。

3. LVGL 库下的特性单个例程测试

3.1 基本测试流程

• LVGL 官方文档已经说明了，例子写好了，没有单独的 .ino 工程，直接调用函数就行了，看文档的这一部分：

  [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-R0xOFce8-1644473376467)(.assets/image-20220210134556768.png)]

• 左侧栏里给出了单个特性的例子，只要去右侧看看 Show C code 中这个例程函数的名字就可以了，比如第一个例程如下：

• 叫做 lv_example_get_started_1(void) ，回到 LVGL_Arduino 例程内，把这句函数放在 #else 下面就行，记得把其他例程注释掉。

  #if 0
      //...
  #else
      //lv_example_btn_1();
     lv_example_get_started_1();
  
      // uncomment one of these demos
      //lv_demo_widgets();            // OK
      //......
  #endif
  

• 再做一步操作，在LVGL_Arduino 例程内，加头文件包含 #include "examples/lv_examples.h"，然后编译烧录成功，其他例子也是类似，我随便测试了一些例子，效果跟官网一样，还有非常多的例子，大家可以逐一测试。

  lv_example_menu_5();
  lv_example_chart_5();
  lv_example_meter_2();
  

• 从下面的例子效果可以明显看出，如果不是那种特备复杂的、大量的UI堆叠，ESP32 显示 LVGL 的 FPS 还是很不错的。

esp32 上 LVGL 库中几个基础特性的例程效果