使用 aic_demo 例程和常用控件
/package/artinchip/lvgl-ui/aic_demo/
| 例程名称 | 主要功能 | 相关技术和控件 |
|---|---|---|
| base_demo | 集成了仪表盘、菜谱、音乐界面、视频播放界面 | 矢量字体、视频播放、tabview 控件、图片控件 |
| dashboard_demo | 仪表盘 demo | arc 控件、图片控件 |
| slide_demo | 界面滑动效果 | tabview |
| elevator_demo | 电梯屏 demo | 串口线程和 LVGL 交互 |
| gif_demo | gif 动画 demo | gif 动画 |
| launcher_demo | 实现了简单的 launcher 界面 | 界面切换、摄像头、tabview |
| simple_player_demo | 实现了简单的播放器功能 | 视频播放 |
| multi_lang_demo | 实现了多国语言 | 文件读取、链表、dropdown |
| demo_hub | 集成了音视频播放、咖啡机、相框等 | 音视频、界面切换、图片切换、homekey |
加载图片
C 数组的方式加载图片的方法:
- 使用转换工具将图片转换成 .c 文件 https://lvgl.io/tools/imageconverter。
- 将 .c 文件放入项目文件夹。
- 调用图片加载函数:
circle_0 = lv_img_create(img_bg); lv_img_set_src(circle_0, &bg0_mix);
资源文件加载图片的方法:
- 将资源文件放到工程目录下。
- 确认 rodata 分区指向的路径包含资源文件。
- 调用图片加载函数:
lv_obj_t *img_info = lv_img_create(main_tab0); lv_img_set_src(img_info, LVGL_PATH(meter_info.png));#define LVGL_PATH(y) CONN(LVGL_DIR, y) #define CONN(x, y) x#y #define LVGL_DIR "L:"LVGL_STORAGE_PATH"/" #define LVGL_STORAGE_PATH "/rodata/lvgl_data" LVGL_PATH(meter_info.png)==>"L:/rodata/lvgl_data/meter_info.png"
| 图片加载方法 | 优点 | 缺点 | 适用场景 |
|---|---|---|---|
| .c 数组 | 图片加载速度快 | flash 和内存空间占用大 | 图标、小图片 |
| 资源文件 | 占用空间少 | 加载速度略慢 | 大图片,多图片 |
矢量字体
- menuconfig 勾选第三方包中的 freetype:
local packages options--> third-party packages options--> freetype - 在 packages\artinchip\lvgl-ui\lvgl_v9\lv_conf.h 文件中使能
lvgl freetype 的宏定义:
#define LV_USE_FREETYPE 1 - 将字体文件放入资源文件中并参考 base_demo 的使用方法。注意:
- 尽量只全局初始化一次,不要反复初始化。如果初始化后没有及时释放,会造成内存泄露。反复初始化还会造成内存碎片化。
- 字体和动画控件勿重叠,距离尽量大于 16 像素。
- 留意部分矢量字体需要调大 LVGL 的栈空间,否则会出现 crash。
- 使用 D13x 时,如果有多款字体,导致 sys heap 不够,可以在 psram 开辟一段空间给矢量字体使用。
弹窗效果
- LVGL 图层叠加,包括 System layer,Top layer 和 Active Screen:

- 基于 Top_layer 创建控件:注: 有些共用的控件放到 Top layer,可以在任何界面调用,不需在每个界面创建同样控件。

多国语言
- 定义字符串数组的方法:
- 配置 ini 文件的方法(参考 multi_lang_demo):注: 使用的字体文件要包含对应语言的文字。
音视频播放
参考代码:
demo_hub/app/aic_audiodemo_hub/app/aic_videosimple_player_demo注:
MP4,MKV 和 AVI 是封装格式,H264 和 MJPEG 是编码格式。
D13x 和 D12x 只支持 MJPEG 编码格式的视频,D21x 可以支持 MJPEG 和 H264 编码格式的视频。
视频循环播放的方法:


线程交互
在 serial_com_demo 中演示了串口通信的实现:
- 创建了一个 uart 线程,用来接收串口信息。
- 在 LVGL 的主线程的定时器中会接收到 uart 的信息。
- 两个线程之间通过消息队列进行信息传递。
注:
多线程通信要做好消息队列的加锁保护。
参数存储
参数存储在 data 分区:
- 确认 data 分区正确配置:


- 创建参数文件,文件路径举例 /data/xxxcfg.bin
- 对参数文件进行读写操作。
文件操作参考代码 /bsp/examples/test-filesystem/test_filesystem.c
参数存储在 RTC SYS_BAK:
D13/D21 包含 128 bits SYS_BAK寄存器,用于系统数据备份,例如掉电重点保护数据。RTC 供电不掉,数据就不会消失。当前 SDK 需要更新 1 个补丁:
/bsp/examples/test-rtc/test_rtc.c/test_rtc_sys_bak 函数
rtc_sys_bak read 0x01
rtc_sys_bak write 0x01 0x45
注:
线程安全和异常处理问题要留意。
界面切换
切换场景一:创建的对象是屏幕对象,通过 lv_src_load_anim 切换。
切换场景二:所有对象都是创建在某一个屏幕对象的,使用隐藏显示的方法切换。
注:
这种切换页面的方法效率会高一些,但是消耗的内存比较大。
界面切换时的注意事项:
- 在屏幕切换的时候,需要对定时器或者相关挂钩的硬件进行停止或者删除操作。
- 一次性初始化所有界面的方式可能会引起 APP 加载慢和内存消耗大的问题。
- 推荐使用 lv_src_load_anim 切换界面,参考 demo_hub/app_entrance.c/app_entrance。
