1. 开发环境
- 开发环境搭建
见《Ubuntu构建ESP32 ESP-IDF开发环境》
- 版本
2. 开发板和显示屏
2.1 ESP32开发板
市面上最常见的esp32开发板。
2.2 TFT LCD显示屏
2.4寸240*320 TFT LCD液晶显示屏幕ST7789驱动SPI 4线串口。
3. ESP32 LVGL下载移植
见《ESP32 ESP-IDF TFT-LCD(ST7735 128x160) LVGL演示》
4. 用VSCode打开项目
见《在VSCode中打开远程主机上的ESP-IDF项目》
查看版本:
~/esp/lv_port_esp32/README.md
- Version of LVGL used: 7.9.
- Version of lv_examples used: 7.9.
5. 构建项目
- 进入lv_port_esp32目录
- cd ~/esp/lv_port_esp32/
- 刷新esp-idf环境
get_idf
- 设定目标芯片
idf.py set-target esp32
- 配置项目
idf.py menuconfig
1) 将闪存设置为4MB
2) 选择显示屏控制芯片
3) SPI总线选择
默认是HSPI。有关ESP32 SPI的说明见《ESP32 ESP-IDF TFT-LCD(ST7735 128x160) LVGL演示》
LCD没有使用MISO,所以接线空着。
4) 定义引脚
接线表:
LCD ST7789 ESP32
GND GND
VCC 3V3
SCL IO14(CLK)
SDA IO13(MOSI)
RES IO17
DC IO16(DC)
CS IO18
BLK IO27
5) 使能Set IRAM as LV_ATTRIBUTE_FAST_MEM提高帧率
6) 屏幕方向
竖屏
横屏
注意:横竖屏转换时两个选项要同时修改。我们使用横屏。
7) 对于SPI接口需要交换RGB565的2个字节
8) 平滑线和园,更好的显示效果
9) 设置时钟频率
10) 设置显示字体
默认都是16。
11) 启用亚像素渲染
更好的显示效果,增加计算量,会降低帧率。
12) 显示资源使用情况
你可以选择Show CPU and FPS count in the right bottom corner
在屏幕的右下角显示CUP和的占用和动画帧率。
13) 是否自动滑动演示
默认时启用以动画方式自动滑动演示。
保存,退出。
- 编译项目
idf.py build
编译速度比WSL快多了。
- 烧写项目
查看USB转串口的设备:
修改/dev/ttyUSB0设备权限:
sudo chmod 777 /dev/ttyUSB0
烧写:
idf.py -p /dev/ttyUSB0 -b 115200 flash
- 启用监视器
idf.py monitor -p /dev/ttyUSB0
当示例正常运行时,将观察到以下输出:
6. 演示
6.1 默认DEMO(控件演示)
6.2 反转颜色(黑底)
6.3 定制demo中可展示的元素
6.4 选择其他的DEMO
项目中4个Demo,通过配置选择使用哪一个。
- Show demo widgets控件演示。
- Demonstrate the usage of encoder and keyboard触摸屏和拖拽控件演示。
- Benchmark your system测试系统性能
- Stress test for LVGL压力测试
7. 演示lv_demo_music
- 更多例子
在~/esp/lv_port_esp32/components/lv_examples/lv_examples/src/目录下还有几个更炫的例子:
对比~/esp/lv_port_esp32/main/main.c
可知,默认只启用了4个例程。下面我们启用lv_demo_music
- 在main.c中添加头文件lv_demo_music.h
- 在main.c的create_demo_application函数中添加lv_demo_music();
- 在/home/ccdc/esp/lv_port_esp32/components/lv_examples/lv_ex_conf.h中添加对Music选项定义
- 在~/esp/lv_port_esp32/components/lv_examples/Kconfig中添加Music选项
- 配置
例子选项中多了Music demo for LVGL,选择它:
配置Music要使用的字体
- 编译、烧写、运行
其他扩展例子仿照上面的方法就可以演示。
参考文档
- esp32-lvgl-(st7789/ILI9341)(基于esp-idf框架)