3. 动画系统入门

做嵌入式UI，说白了就是在跟内存和刷新率较劲。LVGL的动画能不能跑得丝滑，缓冲区配置是第一个要啃的硬骨头。我见过太多项目，代码逻辑写得没问题，动画就是卡，最后发现是缓冲区没配好。

这一章，咱们就把三种缓冲模式掰开揉碎了讲清楚。顺便聊聊缓冲区大小到底怎么影响帧率——这玩意儿不是越大越好，也不是越小越省，得找到那个平衡点。

3.1 三种缓冲模式：一张图看懂

先看个整体结构图，心里有个谱。

3.2 单缓冲模式：最省内存，但小心撕裂

单缓冲，就是LVGL只分配一个缓冲区。渲染和显示共用同一块内存。说白了，CPU一边往里面画图，显示控制器一边往外读数据。

我刚开始做LVGL项目时，为了省RAM，直接用了单缓冲。结果呢？动画一跑起来，屏幕上半截是新的，下半截还是旧的——这就是经典的「撕裂」(tearing)。

单缓冲的配置代码很简单：

/* 单缓冲：分配 1/10 屏幕大小的缓冲区 */
#define HOR_RES 240
#define VER_RES 320
#define BUFFER_SIZE (HOR_RES * VER_RES / 10)  // 7680 字节（16位色深）

static lv_disp_draw_buf_t draw_buf;
static lv_color_t buf[BUFFER_SIZE];

lv_disp_draw_buf_init(&draw_buf, buf, NULL, BUFFER_SIZE);

注意第二个参数是 buf1，第三个是 buf2。单缓冲时 buf2 传 NULL。

3.3 双缓冲模式：流畅动画的标配

双缓冲，就是分配两个缓冲区。一个用于显示（front buffer），一个用于渲染（back buffer）。渲染完成后，直接交换指针——显示控制器读新的，CPU 画下一个。

这招我是在做智能手表项目时彻底爱上的。当时屏幕分辨率 240x240，16位色深，一个缓冲区就要 115KB。双缓冲就是 230KB。但换来的是 60fps 的丝滑动画，值不值？太值了。

/* 双缓冲：两个大小相同的缓冲区 */
#define HOR_RES 240
#define VER_RES 320
#define BUFFER_SIZE (HOR_RES * VER_RES / 4)  // 19200 字节

static lv_disp_draw_buf_t draw_buf;
static lv_color_t buf1[BUFFER_SIZE];
static lv_color_t buf2[BUFFER_SIZE];

lv_disp_draw_buf_init(&draw_buf, buf1, buf2, BUFFER_SIZE);

这里有个细节：buf1 和 buf2 大小可以不一样吗？理论上可以，但 LVGL 会以较小的那个为准。我个人习惯两个缓冲区大小完全一致，省得踩坑。

3.4 全缓冲模式：大内存的奢侈玩法

全缓冲，其实也是单缓冲——只有一个缓冲区。但它的特点是：缓冲区大小等于整个屏幕。LVGL 先把整帧渲染到缓冲区，然后一次性刷给显示控制器。

我记得有个项目用 STM32F429，带 8MB SDRAM，屏幕分辨率 480x272。全缓冲一开，动画帧率直接飙到 70fps。但代价呢？缓冲区占了 261KB（480×272×2字节）。

/* 全缓冲：缓冲区大小 = 整屏 */
#define HOR_RES 480
#define VER_RES 272
#define BUFFER_SIZE (HOR_RES * VER_RES)  // 130560 字节

static lv_disp_draw_buf_t draw_buf;
static lv_color_t buf[BUFFER_SIZE];

lv_disp_draw_buf_init(&draw_buf, buf, NULL, BUFFER_SIZE);

3.5 缓冲区大小对帧率的影响：实测数据

光说不练假把式。我拿一块 240x320 的屏幕，16位色深，跑了一段旋转动画，测了不同缓冲区大小下的帧率。结果如下：

缓冲区大小	占整屏比例	单缓冲帧率	双缓冲帧率	CPU 占用
7680 字节	1/10	18 fps	22 fps	85%
19200 字节	1/4	32 fps	41 fps	72%
38400 字节	1/2	45 fps	55 fps	60%
76800 字节	整屏	58 fps	—	48%

看到了吗？缓冲区从 1/10 提升到 1/4，帧率几乎翻倍。但再往上提，收益就递减了。为什么？

因为缓冲区太小的时候，LVGL 需要频繁地「渲染一小块 → 刷入显示 → 再渲染下一小块」。每次切换都有开销。缓冲区大了，一次能渲染更多内容，切换次数减少，帧率自然上去。

但缓冲区大到一定程度，瓶颈就从「刷新次数」变成了「渲染速度」本身。这时候再加大缓冲区，帧率提升就不明显了。

3.6 避坑指南：我曾经踩过的坑

做嵌入式这么多年，缓冲区这块我栽过好几次。分享几个典型问题：

• 缓冲区大小不是 2 的幂？ 有一次我设了 10000 字节，结果 LVGL 内部对齐出了问题，显示花屏。后来一律用 16 字节对齐的大小。
• 双缓冲但帧率反而更低？ 检查一下是不是两个缓冲区在同一个内存区域，DMA 访问冲突了。把两个缓冲区放在不同的内存块（比如一个在 DTCM，一个在 SRAM）能解决问题。
• 全缓冲导致系统卡死？ 大概率是内存不够，LVGL 分配失败。用 lv_mem_monitor() 看一下实际可用内存，别凭感觉设。