lvgl 增加自定义SYMBOL

使用LVGL 增加自定义的symbol

嵌入式设备的空间有限,使用字库图标能极大的丰富界面,又能控制ROM的占用,LVGL自带了20几个symbol,在实际的使用过程中,可能不能满足项目的使用,需要自己添加一些symbol。

lvgl自带的symbol

lvgl 内置字库自带的symbol如下:
在这里插入图片描述

添加symbol

要添加一个symbol,我们首先需要找到对应的图标,fontawesome提供了多达上千种。
官方网站:https://fontawesome.com/,目前最新的发布版本为5,最新的fontawesome6 也马上要发布了

要添加一个symbol,首先需要找到这个symbol的unicode码
例如:accusoft图标
进入图标的详情页面:https://fontawesome.com/icons/accusoft?style=brands
在这里插入图片描述
在上面有一个f369 则对应的是其的unicode码

生成字库

找好了后我们就要生成字库了,字库使用lvgl在线生成工具生成即可:
https://lvgl.io/tools/fontconverter
按照说明添加即可

代码添加

为了在程序中方便使用添加的图标,我们需要对图标进行定义

系统自带图标定义

  • 文件:\lvgl\src\lv_font\lv_symbol_def.h
  • 定义

#define LV_SYMBOL_AUDIO “\xef\x80\x81” /61441, 0xF001/
#define LV_SYMBOL_VIDEO “\xef\x80\x88” /61448, 0xF008/
#define LV_SYMBOL_LIST “\xef\x80\x8b” /61451, 0xF00B/
#define LV_SYMBOL_OK “\xef\x80\x8c” /61452, 0xF00C/
#define LV_SYMBOL_CLOSE “\xef\x80\x8d” /61453, 0xF00D/
#define LV_SYMBOL_POWER “\xef\x80\x91” /61457, 0xF011/
#define LV_SYMBOL_SETTINGS “\xef\x80\x93” /61459, 0xF013/
#define LV_SYMBOL_HOME “\xef\x80\x95” /61461, 0xF015/
#define LV_SYMBOL_DOWNLOAD “\xef\x80\x99” /61465, 0xF019/
#define LV_SYMBOL_DRIVE “\xef\x80\x9c” /61468, 0xF01C/
#define LV_SYMBOL_REFRESH “\xef\x80\xa1” /61473, 0xF021/
#define LV_SYMBOL_MUTE “\xef\x80\xa6” /61478, 0xF026/
#define LV_SYMBOL_VOLUME_MID “\xef\x80\xa7” /61479, 0xF027/
#define LV_SYMBOL_VOLUME_MAX “\xef\x80\xa8” /61480, 0xF028/

自定义图标定义

按照系统自带的方式添加,前面部分为utf-8编码,为了能得到unicode对应的utf-8编码,

  • 使用工具:

https://www.qqxiuzi.cn/bianma/Unicode-UTF.php
例如上面的那个图标
在这里插入图片描述

  • 6
    点赞
  • 59
    收藏
    觉得还不错? 一键收藏
  • 8
    评论
LVGL 中,可以使用 lv_keyboard_create 函数创建一个键盘对象,并使用 lv_keyboard_set_map 函数设置键盘的按键映射。按键映射是一个二维数组,其中每个元素表示一个按键,可以自定义按键的标签、宽度、高度、样式等属性。 以下是一个简单的示例代码,演示如何创建一个带有自定义按键的键盘: ```c // 定义按键映射 static const char *kb_map[] = { "1", "2", "3", "4", "5", "6", "7", "8", "9", "0", LV_SYMBOL_BACKSPACE, "q", "w", "e", "r", "t", "y", "u", "i", "o", "p", "a", "s", "d", "f", "g", "h", "j", "k", "l", LV_SYMBOL_KEYBOARD, "z", "x", "c", "v", "b", "n", "m", ",", ".", "?", LV_SYMBOL_OK, LV_SYMBOL_CLOSE, "" }; // 创建键盘对象 lv_obj_t *kb = lv_keyboard_create(lv_scr_act(), NULL); // 设置按键映射 lv_keyboard_set_map(kb, LV_KEYBOARD_MODE_TEXT_LOWER, kb_map); // 设置自定义按键样式 lv_style_t style_btn_rel; lv_style_t style_btn_pr; lv_style_copy(&style_btn_rel, &lv_style_btn_rel); lv_style_copy(&style_btn_pr, &lv_style_btn_pr); style_btn_rel.body.main_color = LV_COLOR_GRAY; style_btn_rel.body.grad_color = LV_COLOR_GRAY; style_btn_pr.body.main_color = LV_COLOR_BLUE; style_btn_pr.body.grad_color = LV_COLOR_BLUE; style_btn_pr.text.color = LV_COLOR_WHITE; lv_keyboard_set_style(kb, LV_KEYBOARD_STYLE_BTN_REL, &style_btn_rel); lv_keyboard_set_style(kb, LV_KEYBOARD_STYLE_BTN_PR, &style_btn_pr); // 添加自定义按键 lv_keyboard_add_text(kb, "Enter", strlen("Enter"), NULL); ``` 在上述代码中,首先定义了一个按键映射 kb_map,其中包含了常见的字母、数字、符号等按键,以及两个 LVGL 的符号图标,分别表示退格和确定。然后创建了一个键盘对象 kb,并使用 lv_keyboard_set_map 函数设置了按键映射。接着使用 lv_keyboard_set_style 函数设置了按键的样式,包括材质、颜色、字体等属性。最后使用 lv_keyboard_add_text 函数添加了一个自定义按键,其标签为 "Enter",长度为 strlen("Enter"),样式为默认样式。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值