LVGL8.3标签Label高级应用

LVGL8.3 标签 Label 高级应用

1. 动态文本

所谓动态文本即指传入的字符串或数组在 label 对象里有一份拷贝，label 会使用动态内存申请，因此传入的数据可以在调用完 lv_label_set_text 后外部释放。数据格式可以是以 '\0' 结尾的字符串，也可以是数组。

2. 静态文本

所谓静态文本是指 label 对象用于显示的文本数据实际保存在外部，因此传入 lv_label_set_static_text 的数据不可以释放，最好是静态变量。数据格式可以是以 '\0' 结尾的字符串，也可以是数组。

3. 颜色重绘

在显示文本中，可以使用命令来重绘色部分文本。使用格式如下：#16进制颜色值文本#。重绘色以 #16进制颜色值 开始，以 # 结束，中间的 文本 就会被重绘色。

16进制颜色值即由 r, g, b 三通道，每个通道 1 字节组成，一共有 3 个字节。例如 FF0000: r:0xFF, g:0x00, b: 0x00。

注意颜色值与文本直接至少有一个空格。

在对一个 label 对象使用重绘色功能之前，需要先使用 lv_label_set_recolor 使能重绘色功能，具体使用形式如下。

c 复制代码

lv_label_set_recolor(label1, true);//先得使能文本重绘色功能
lv_label_set_text(label1, "#ff0000 red#,#00ff00 green#,#0000ff blue#");//使用了 3 次重绘色

文本重绘色仅工作于单行，因此若在文本中出现了 \n，或文本被 LV_LABEL_LONG_BREAK 换行了，新行的文本不会被重绘色，例如。

c 复制代码

lv_label_set_recolor(label, true);       /*Enable re-coloring by commands in the text*/
lv_label_set_text(label, "#0000ff Re-color# #ff00ff words# #ff0000 of a# label "
                          "and  wrap long text automatically.");

4. 长文本

label 对象一共有如下几种长文本模式，如下：

(1) LV_LABEL_LONG_EXPAND，自动扩展对象的大小来包裹文本内容。

(2) LV_LABEL_LONG_BREAK，保持对象的宽度不变，当文本内容的宽度超过对象的宽度时会自动换行,然后同时自动扩展对象的高度来包裹文本内容的高度。

(3) LV_LABEL_LONG_DOT ，保持对象的大小不变，当文本内容太长显示不下时，会在文本末尾显示 ... 省略号。

(4) LV_LABEL_LONG_SROLL ，保持对象的大小不变，当文本内容太长显示不下时,会自动循环向前向后滚动文本。

(5) LV_LABEL_LONG_SROLL_CIRC ，保持对象的大小不变，当文本内容太长显示不下时，会自动循环环形滚动文本。

(6) LV_LABEL_LONG_CROP，保持对象大小不变,超过的文本内容将会被剪切掉。

注意： 不同的长文本模式对 label 对象的大小也有影响。EXPAND 会使对象的 width 和 height 都无效，BREAK 会使对象的 height 无效，width 有效，剩余的模式 DOT, CROP, SROLL, SROLL_CIRC 其对象 width 和 height 都有效。

5. 混合显示

在 LVGL 中，要在一个 Label（标签）中同时显示文字和图标非常简单。LVGL 内置了一套图标字体，你可以像拼接普通字符串一样，将内置图标宏与文字直接拼接在一起。

具体操作步骤如下：

开启文本重着色 lv_label_set_recolor(label, true)（如果图标与文字需要不同颜色）。

拼接图标与文字，使用 lv_label_set_text 函数，将图标宏（如 LV_SYMBOL_OK）和字符串（如 "Apply"）直接放在一起即可。

c 复制代码

/*显示一个"对勾"图标，后面跟着"Apply"文字*/
lv_label_set_text(my_label, LV_SYMBOL_OK " Apply");
/*显示左右箭头包围着中间的文字*/
lv_label_set_text(my_label, LV_SYMBOL_LEFT " 666 " LV_SYMBOL_RIGHT);

在拼接时，建议在图标宏和字符串之间手动添加空格（例如 " Apply" 前面的空格），否则图标和文字会紧紧挨在一起，影响美观。

注意：

这种方式要求图标和普通的文字字体在同一个字库下，也就是说图标和字体要打包在一起，这里使用的是 LVGL 自带的符号，这个自然没有问题，而真正的问题是我么自定义的符号如何处理。

5.1 字体融合

在生成你的自定义字体时，直接将需要的图标字体（或图标编码）合并进去。这样，同一个字体文件中既包含了中文字符，也包含了你需要的图标，就可以完美地在一个 Label 中直接拼接显示了。

优点： 完美支持在一个 Label 中自由拼接文字和图标，代码极其简洁，且图标和文字的颜色、大小能绝对统一。

缺点： 首次制作字体时需要多花一点时间配置。

步骤如下：

(1) 打开 LVGL 官方在线字体转换工具。

(2) 在 TTF/WOFF font 处，上传你的自定义字体文件（比如中文字体 .ttf）。

(3) 点击工具下方的 Include another font（即包含另一个字体） 按钮。

(4) 上传 LVGL 的图标字体文件（例如 FontAwesome，文件名为 FontAwesome5-Solid+Brands+Regular.woff，可以在 LVGL 官网资源中找到），或者上传你自己的图标 .ttf 文件。

(5) 在 Range 栏中，分别为两个字体填写需要包含的 Unicode 编码范围（例如中文字体的范围和你需要的图标 Unicode 编码，例如 0xF078 等）。

(6) 点击转换，生成的单一 C 文件就同时拥有了文字和图标的两套字库的字模。

5.2 组合 Label

你可以创建两个独立的 Label，一个专门用来显示图标（使用图标字体），另一个用来显示文字（使用中文或其他私有字体），然后通过横向布局将它们 "拼" 在一起。不需要图标显示时隐藏图标 label，纯文字会自动居中，需要图标显示时解除隐藏图标 label，此时图标和文字自动分配空间一起居中。

优点： 逻辑也不复杂，随用随改。

缺点： 如果界面元素非常多，会增加一些对象管理的复杂度。

详细查看：

https://www.jianshu.com/p/26334a068a04

http://dljz.nicethemes.cn/news/show-35645.html