关注+星标公众号，不错过精彩内容

作者 | 量子君
微信公众号 | 极客工作室

---

【LVGL进阶日记】专栏目录
第一章 开源LVGL在MCU上的移植

---

前言

LVGL 可以说是这两年才刚开始流行的一个小型开源嵌入式 GUI 库,具有界面精美,消耗资源小、可移植度高、响应式布局等特点，全库采用纯 C 语言开发，LVGL 库的更新速度非常快。

本章介绍了LVGL主要特性、对MCU性能要求、移植到MCU的关键步骤及重要代码块等详解。

---

一、LVGL介绍

LVGL 官方资料丰富，相关链接如下：
LVGL 的官方网址
LVGL 的 github 网址
LVGL 的在线文档网址

1.1 LVGL的主要特性如下：

• 具有非常丰富的内置控件，像 buttons、charts、lists、sliders、images等
• 高级图形效果：动画、反锯齿、透明度、平滑滚动
• 支持多种输入设备，像 touchpad、mouse、keyboard、encoder等
• 支持多语言的 UTF-8 编码
• 支持多个和多种显示设备，例如同步显示在多个彩色屏或单色屏上
• 完全自定制的图形元素
• 硬件独立于任何微控制器或显示器
• 可以缩小到最小内存 (64 kB Flash、16 kB RAM)
• 支持操作系统、外部储存和 GPU（非必须）
• 仅仅单个帧缓冲设备就可以呈现高级视觉特效
• 使用 C 编写以获得最大兼容性(兼容 C++)
• 支持 PC 模拟器
• 为加速 GUI 设计，提供教程,案例和主题,支持响应式布局
• 提供了在线和离线文档
• 基于自由和开源的 MIT 协议

1.2 LVGL对MCU的要求如下:

1. 16、32 或 64 位的单片机（微控制器）或处理器

2. 微处理器的主频最好高于 16MHZ

3. Flash / ROM：如果只用 LVGL 核心组件的话，则至少需要 64kB 的容量，如果想完整使用的话，最好保证 180KB 以上的容量

4. RAM：
   ①静态 RAM：大约 8 到 16 kB，这取决于你所用的组件功能和 objects 控件对象类型；
   ②栈：至少为 2Kb，一般推荐值为 4kB；
   ③动态数据(堆)：至少 4kB,如果你用到了多个或多种控件的话,那么最好设置为 16kB 以上，这个是可以通过lv_conf.h 配置文件中的LV_MEM_SIZE宏来定义的；
   ④显示缓冲区：至少要比“水平分辨率像素”要大，一般推介值为 10 倍的“水平分辨率像素”。举个例子：假如我们屏幕的水平分辨率为480个像素，采用16位的颜色深度进行显示，即一个像素占 2 个字节，那么推介的显示缓冲区大小为 10 * 480 * 2 = 9600 个字节；

5. LV_MEM_SIZE 的大小，这个就是控制 littleVGL 中所谓的动态数据堆的大小，是用来给控件的创建动态分配空间的，我们这里设置为 16KB 的大小 #define LV_MEM_SIZE (16U * 1024U)；

6. 用定时器设置其每隔 1ms 进入中断，为 littleVGL 提供 1ms 的心跳节拍，当然你也可以采用其他的定时器，原理都是一样的；

7. littleVGL 的内存消耗主要体现在 2 个方面：第一个是显示缓冲区、第二个就是我们这里所要讲到的堆，而 littleVGL 堆的内存分配也是有 2 种方式，如下所示：
   ①采用内部的 SRAM，原理定义一个静态的局部数组；
   ②和显示缓冲区一样，采用外部的大容量 SRAM；

8. 定义屏幕的刷新周期和此功能相关的配置项只有1个，为LV_DISP_DEF_REFR_PERIOD，它的默认值为30ms，此值设置的过大的话就可能会出现卡顿的现象，设置的过小的话就会有点浪费性能，我们直接采用默认值就可以了，不用过多理会。

二、移植LittlevGL到MCU

2.1 LVGL源码下载和文件组织

Github下载LittleVGL源代码，移植到工程中；且需要有一个最基本的LCD驱动例程，实现初始化、打点等基础功能。

在工程中新建mg_lvgl文件夹将下载好的lvgl源码发在此处，新建lvgl_driver文件夹将lvgl源码包下porting文件夹中与LCD相关的配置模板拷贝出来放到lvgl_driver下，并分别更名为lv_port_disp.c和lv_port_disp.h：

将lvgl源码包下的lv_conf_template.h拷贝到mg_lvgl目录下，然后改名为lvgl_conf.h，将lv_conf.h中将宏打开 #if 0改为1，如下：

/**
 * @file lv_conf.h
 * Configuration file for v7.10.0-dev
 */

/*
 * COPY THIS FILE AS `lv_conf.h` NEXT TO the `lvgl` FOLDER
 */

#if 1 /*Set it to "1" to enable content*/

#ifndef LV_CONF_H
#define LV_CONF_H
/* clang-format off */
#include <stdint.h>

2.2 LVGL配置（lvgl_conf.h）：

1. 分辨率大小设置：

/* Maximal horizontal and vertical resolution to support by the library.*/
#define LV_HOR_RES_MAX          (128)  
#define LV_VER_RES_MAX          (160) 

2. 颜色深度设置：

/* Color depth:
 3. - 1:  1 byte per pixel
 4. - 8:  RGB332
 5. - 16: RGB565
 6. - 32: ARGB8888
 */
#define LV_COLOR_DEPTH     1

3. 界面伸缩比例调节：
   用来调节界面缩放比例的,此值越大,控件分布的就越散,控件自身的间隔也会变大，这里设置为60。

/* Dot Per Inch: used to initialize default sizes.
 8. E.g. a button with width = LV_DPI / 2 -> half inch wide
 9. (Not so important, you can adjust it to modify default sizes and spaces)*/
#define LV_DPI              60     /*[px]*/

4. 动态数据堆大小设置：
   这个参数是用于控制 littleVGL 中所谓的动态数据堆的大小，是用来给控件的创建动态分配空间的，这里我们设置为16KB。

/* Size of the memory used by `lv_mem_alloc` in bytes (>= 2kB)*/
#