ESP32 ESP-IDF LVGL ST7789 演示lv_demo_music

陈拓 2022/09/10-2022/09/11

1. 开发环境

  • 开发环境搭建

见《Ubuntu构建ESP32 ESP-IDF开发环境》

https://blog.csdn.net/chentuo2000/article/details/126777261?spm=1001.2014.3001.5502

  • 版本

 

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演示》

https://blog.csdn.net/chentuo2000/article/details/126668088?spm=1001.2014.3001.5502

4. 用VSCode打开项目

见《在VSCode中打开远程主机上的ESP-IDF项目》

https://blog.csdn.net/chentuo2000/article/details/126794177?spm=1001.2014.3001.5502

查看版本:

~/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演示》

https://blog.csdn.net/chentuo2000/article/details/126668088?spm=1001.2014.3001.5502

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

项目中4Demo,通过配置选择使用哪一个。

 

  • 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要使用的字体

  • 编译、烧写、运行

 

其他扩展例子仿照上面的方法就可以演示。

参考文档

  1. esp32-lvgl-(st7789/ILI9341)(基于esp-idf框架)

https://blog.csdn.net/qq_37429313/article/details/122085869

  • 3
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
ESP32 ESP-IDF LVGL 是一种用于嵌入式系统的开发框架,LVGL 则是一个用于创建嵌入式图形界面的开源图形库。关于视频流的处理,可以通过调用 ESP-IDF 中的函数来实现。在这个项目中,作者使用了 JPEG 流封装 AVI 视频的方法,将实时读取的图片写入 AVI 文件,并保存到 SD 卡中。通过调用相关函数,如 `jpeg2avi_start`、`jpeg2avi_add_frame` 和 `jpeg2avi_end`,可以实现将一帧帧的图片构成的视频保存下来。这个方法结合了作者原理的讲解和详细的代码示例,非常值得参考和感谢作者原野追逐的贡献。在这个项目中,ESP32 通过 LVGL 图形库提供的界面,可以实时读取摄像头数据,并将视频流传输到网页上,同时将读取的图片写入 SD 卡中的 AVI 文件中。然而,由于 ESP32 的处理能力有限,同时完成读取摄像头数据、传输到网页、写入 SD 卡这三个功能对其来说是一项挑战。在测试中,视频流的帧率较低,不够流畅。因此,需要进行性能优化或者考虑其他解决方案来改善视频流的流畅度。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [VScode+esp-idf:例程(esp32-web-camera)保存视频到sd卡(附源码)](https://blog.csdn.net/hwd00001/article/details/126679619)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

晨之清风

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值