本文理论知识居多，开始一遍了解功能即可，后续用到再当字典查，文中涉及的实操界面，需要先搭建环境，需观看我上一篇文章：创建第一个LVGL工程https://mp.weixin.qq.com/s/zJ8hf4f36GGpJW_8vHf0Jw

LVGL应用编程：标签（lv_label）控件详解

一、标签控件：界面上的"文字"担当

想象一下，你正在设计一个智能手表界面：

• • 需要显示时间："12:30"
• • 需要显示温度："25°C"
• • 需要显示通知："您有新的消息"

这些文字内容就是通过lv_label（标签）控件来显示的！

二、标签的基础使用

2.1 创建最简单的标签

// 创建标签（就像贴一张便签纸）lv_obj_t *label = lv_label_create(lv_scr_act());// 居中显示lv_obj_center(label);// 设置文字内容lv_label_set_text(label, "Hello LVGL!");

2.2 显示变量值

// 显示静态文本 + 变量int temperature = 25;lv_label_set_text_fmt(label, "temp: %d°C", temperature);

2.3 多行文本显示

// 方法1：使用\n换行lv_label_set_text(label, "第一行\n第二行\n第三行");// 方法2：长文本自动换行（需要设置宽度）lv_obj_set_width(label, 400);  // 设置标签宽度lv_label_set_long_mode(label, LV_LABEL_LONG_WRAP);  // 设置长文本模式为自动换行lv_label_set_text(label, "This is a long text that will automatically wrap when it exceeds the width of the label....");  //超过宽度自动换行

三、文字颜色

3.1 设置整体文字颜色

// 方法1：通过样式设置（推荐）lv_obj_set_style_text_color(label, lv_color_hex(0xFF0000), LV_PART_MAIN);  // 红色// 方法2：设置文字&颜色lv_label_set_recolor(label, true);lv_label_set_text(label, "#00FF00 green#");  // 绿色

3.2 设置部分文字颜色（多彩文本）

// 步骤1：启用重着色功能lv_label_set_recolor(label, true);// 步骤2：在文本中使用颜色代码lv_label_set_text(label,    "#ff0000 red# "          // 红色文本    "#00ff00 green# "          // 绿色文本      "#0000ff blue#"           // 蓝色文本);

注意：颜色代码格式为#RRGGBB，必须用#包围！

四、字体系统：让文字更好看

4.1 使用LVGL内置字体

// 使用默认字体（推荐）lv_obj_set_style_text_font(label, &lv_font_montserrat_16, LV_PART_MAIN);// 使用更大的字体lv_obj_set_style_text_font(label, &lv_font_montserrat_24, LV_PART_MAIN);

4.2 显示中文（内置CJK字体）

// 第一步：确认lv_conf.h中启用CJK字体// 找到并确保这行没有被注释：// #define LV_FONT_SIMSUN_16_CJK 1// 第二步：代码中使用CJK字体lv_obj_set_style_text_font(label, &lv_font_simsun_16_cjk, LV_PART_MAIN);lv_label_set_text(label, "你好 LVGL!");

局限性：内置CJK字体可能缺少一些简体中文字符，如果遇到显示为方框，就需要使用自定义字体。

五、自定义字体解决方案

5.1 方案一：离线转换字体（简单项目推荐）

适用场景：字体固定、文字量不大、资源受限的项目。

步骤1：使用在线工具转换字体

先选择想要使用的字体下载：

字体ttf下载:https://www.fonts.net.cn/fonts-zh-1.html

然后访问LVGL官方字体转换工具：https://lvgl.io/tools/fontconverter

大部分默认选择即可

步骤2：下载并添加到工程

// 1. 下载生成的testfont.c// 2. 放到工程下main.c的目录// 3. 在代码中声明和使用LV_FONT_DECLARE(testfont);  // extern const lv_font_t test_fontvoid create_label() {    lv_obj_t *label = lv_label_create(lv_scr_act());    lv_obj_set_style_text_font(label, &testfont, LV_PART_MAIN);    lv_label_set_text(label, "自定义字体");}

注意：

优点：简单直接，运行效率高缺点：字体大小固定，不支持动态调整

5.2 方案二：FreeType动态字体（推荐）

适用场景：需要动态调整字体大小、支持多种字体、文字量大的项目。

步骤1：准备字体文件

从字体网站（如fonts.net.cn）下载需要的字体：

思源黑体 Regular：SOURCEHANSANSCN_REGULAR.OTF思源黑体 Light：SOURCEHANSANSCN_LIGHT.OTF  数字字体：Library-3-am-3.otf

步骤2：创建工程目录结构

你的工程/├── res/                    # 资源文件夹│   ├── font/               # 字体文件夹|    |    ├── font_conf.h     # 字体配置头文件│   │   ├── SOURCEHANSANSCN_REGULAR.OTF│   │   ├── SOURCEHANSANSCN_LIGHT.OTF│   │   └── Library-3-am-3.otf│   └── res_conf.h          # 资源配置文件├── main.c└── CMakeLists.txt

步骤3：编写资源配置文件

res_conf.h - 统一管理资源路径：

#ifndef _RES_CONF_H_#define _RES_CONF_H_// 区分PC仿真和开发板环境#ifdef SIMULATOR_LINUX    // PC仿真路径（绝对路径，这里用相对路径./build/app1/res/font/也可，但执行需用app_sdk路径）    #define FONT_PATH "/home/hutter/work/app_sdk/build/app1/res/font/"#else    // 开发板路径（绝对路径）    #define FONT_PATH "/usr/res/font/"#endif#endif

font_conf.h - 字体配置头文件：

#ifndef _FONT_CONF_H_#define _FONT_CONF_H_#include "res_conf.h"#include "font_utils.h"  // 字体管理// 字体类型枚举typedefenum {    FONT_TYPE_CN = 0,      // 思源黑体常规    FONT_TYPE_CN_LIGHT,    // 思源黑体细体    FONT_TYPE_NUMBER,      // 数字字体} FONT_TYPE;// 字体路径定义#define FONT_TYPE_CN_PATH      FONT_PATH "SOURCEHANSANSCN_REGULAR.OTF"#define FONT_TYPE_CN_LIGHT_PATH FONT_PATH "SOURCEHANSANSCN_LIGHT.OTF"#define FONT_TYPE_NUMBER_PATH  FONT_PATH "Library-3-am-3.otf"// 字体初始化宏（一键初始化所有字体）#define font_init() \    do { \        add_font(FONT_TYPE_CN, FONT_TYPE_CN_PATH); \        add_font(FONT_TYPE_CN_LIGHT, FONT_TYPE_CN_LIGHT_PATH); \        add_font(FONT_TYPE_NUMBER, FONT_TYPE_NUMBER_PATH); \    } while(0)#endif

步骤4：修改CMakeLists.txt

cmake_minimum_required(VERSION 3.15) # 指定CMake的最低版本要求project(demo1) # 设置工程名# 定义宏，用于区分PC仿真环境if(SIMULATOR_LINUX)    add_compile_definitions(SIMULATOR_LINUX)endif()# 复制资源文件到构建目录file(COPY res DESTINATION ${PROJECT_BINARY_DIR})aux_source_directory(. SOURCES) # 自动收集当前目录下所有的.c文件，存入SOURCES变量add_executable(demo1 ${SOURCES}) # 告诉CMake要生成一个可执行文件demo1，并使用源文件列表（${SOURCES}）# 添加头文件路径target_include_directories(demo1 PRIVATE    ./    res/    res/font/    ${CMAKE_SOURCE_DIR}/component/font  # 字体组件路径    ${CMAKE_SOURCE_DIR}/lvgl            # LVGL库目录)# 链接库target_link_libraries(demo1 PRIVATE    lvgl    font  # 字体管理库)

步骤5：在main.c中使用字体

#include "font_conf.h"int main() {    // 1. LVGL初始化    lv_init();    // 2. 字体初始化（必须在lv_init之后）    font_init();    // 3. 显示设备初始化    lv_port_disp_init(true);    // 4. 创建标签并使用字体    lv_obj_t *label = lv_label_create(lv_scr_act());    lv_obj_center(label);    // 获取字体（类型：常规字体，大小：50像素）    lv_font_t* font = get_font(FONT_TYPE_CN, 50);    if (font != NULL) {        lv_obj_set_style_text_font(label, font, 0);    }    lv_label_set_text(label, "FreeType红龙创客");    while (1) {        lv_task_handler(); // 处理LVGL任务        usleep(1000);    }    return 0;}

注意：font_init();初始化不要忘记了

步骤6：封装字体设置函数（选看）

// 字体设置工具函数static void obj_font_set(lv_obj_t *obj, int type, uint16_t size) {    lv_font_t* font = get_font(type, size);    if (font != NULL) {        lv_obj_set_style_text_font(obj, font, 0);    }}// 使用示例void create_ui() {    // 标题 - 大号粗体    lv_obj_t *title = lv_label_create(lv_scr_act());    lv_obj_align(title, LV_ALIGN_TOP_MID, 0, 20);    obj_font_set(title, FONT_TYPE_CN, 32);    lv_label_set_text(title, "智能家居系统");    // 温度 - 常规字体    lv_obj_t *temp = lv_label_create(lv_scr_act());    lv_obj_align(temp, LV_ALIGN_CENTER, 0, 0);    obj_font_set(temp, FONT_TYPE_CN, 24);    lv_label_set_text(temp, "室内温度: 25°C");    // 时间 - 数字字体    lv_obj_t *time = lv_label_create(lv_scr_act());    lv_obj_align(time, LV_ALIGN_BOTTOM_MID, 0, -20);    obj_font_set(time, FONT_TYPE_NUMBER, 20);    lv_label_set_text(time, "12:30:45");}

六、总结与备忘

常用函数速查表

字体方案选择指南