LVGL -按键介绍 下
4 图标
4.1 内置图标
LVGL 提供了一个很方便的 图标字体 系统，它使用了 lv_label 来显示文本或图标。你可以选择 Font Awesome 或其他图标字体，并将其直接嵌入应用中。LVGL 内建图标字体（如 LV_SYMBOL_*）是可以改变大小的。通过调整 lv_label 的样式和字体大小，可以轻松改变图标的显示大小
#include “lvgl.h”
// 创建带图标的按钮
void create_btn_with_icon(void)
{lv_obj_t *btn = lv_btn_create(lv_scr_act());lv_obj_set_size(btn, 150, 50);lv_obj_align(btn, LV_ALIGN_CENTER, 0, 50);// 添加图标（使用 Unicode 字符，比如 Font Awesome 图标）lv_obj_t *label = lv_label_create(btn);lv_label_set_text(label, LV_SYMBOL_WIFI); // 使用内置的图标符号lv_obj_set_style_text_font(label, &lv_font_montserrat_32, 0); // 改变为 32px 大小lv_obj_center(label);
}
4.2 使用图片作为图标
如果你想用自定义图片作为图标（比如 PNG、JPG），你需要将图片转化为 LVGL 支持的格式（例如，LV_IMG_DECLARE）。
🖼 示例：使用图片作为图标
首先，假设你已经有一个图标图片（比如一个 .png 格式的图标），你需要将它转换成 LVGL 支持的格式。
步骤 1：将图片转换为 C 文件
使用 LVGL 的 imageconverter 工具（在 LVGL 官方工具包中）将图标图片转换为 C 代码。然后将这个 C 文件包含到项目中。
步骤 2：加载和显示图标
假设你已经转换了一个 my_icon.c 文件，其中包含了图标的 C 数据。
#include "lvgl.h"
#include "my_icon.c" // 引入转换后的图片数据文件// 创建一个按钮，并在按钮上显示图标
void create_btn_with_image(void)
{lv_obj_t *btn = lv_btn_create(lv_scr_act());lv_obj_set_size(btn, 150, 50);lv_obj_align(btn, LV_ALIGN_CENTER, 0, 50);// 创建一个图片对象作为图标lv_obj_t *img = lv_img_create(btn);lv_img_set_src(img, &my_icon); // 使用转换后的图片对象lv_obj_center(img); // 图片居中
}
4.3 自创 图标字体（如 Font Awesome）
步骤：
-
下载图标字体（如 Font Awesome）： 你可以从 Font Awesome 官网 或其他图标字体库下载所需的字体文件。
-
转换字体为 LVGL 可用的格式： 使用 LVGL 自带的 fontconvert 工具，将字体文件（如 TTF 文件）转换为 LVGL 可用的 C 代码。
fontconvert --size=16 fontawesome.ttf fontawesome_16.c
-
将字体文件包含到项目中： 把 fontawesome_16.c 文件添加到你的项目源文件中。
-
在 LVGL 中设置字体： 通过 lv_obj_set_style_text_font() 来设置自定义字体。