LVGL_V8.3入门五---自定义字体(中文)图标字体生成及使用

系列文章目录



一、自定义字体

1、从阿里巴巴矢量图库中选择一些现有的字体
官网:https://www.iconfont.cn/ 选择字体库-》阿里妈妈数黑体

在这里插入图片描述
2、下载字体库
在这里插入图片描述
3、解压后将TTF文件,放到SquareLine文件夹下面的asserts文件夹下
在这里插入图片描述
以下就是加入的新的中文字体
在这里插入图片描述
4、设置字体大小、深度、名字
在这里插入图片描述
5、在STYLE SETTINGS中选择自定义的字体
在这里插入图片描述

二、图标字体

图标字体是 web 前端中流行的一种技术,它以字体的形式,呈现出一个单色的图标。在LVGL 中,自带了许多常用图标字体,这极大地方便了用户的界面开发。大家需要使用这些图标字体,可以打开lv_symbol_def.h文件,查找相应的图标字体枚举,所有枚举如下源码所示:
在这里插入图片描述
在这里插入图片描述
以上是LVGL自带的图标字体,但是如果这些图标不能满足我的需求可以按照以下步骤生成图标字体。

1、从阿里巴巴矢量图库中选择图标
在这里插入图片描述
2、加入购物车
在这里插入图片描述
3、添加至项目
在这里插入图片描述
4、下载至本地
在这里插入图片描述
5、同样将TTF文件添加到放到SquareLine文件夹下面的asserts文件夹下
在这里插入图片描述
6、复制代码
在这里插入图片描述
修改成十六进制在这里插入图片描述
7、利用工具将Unicode和UTF编码转换,因为LVGL 支持 2 种编码方式:第一种是 ASCII 编码,这种编码只支持英文字符的显示;第二种是 UTF-8 编码。我们要将这个图标转换成UTF-8的格式。下面是转换的网址。
https://www.qqxiuzi.cn/bianma/Unicode-UTF.php。将复制的代码拷贝过来,将代码&#xe8ae改为0000e8ae,32位否则会报错。
在这里插入图片描述
8、将生成的utf-8字符复制到TEXT里面。注意这里直接将上面生成的对应字符直接复制过来就可以。
在这里插入图片描述

三、实现效果

在这里插入图片描述

四、在单片机上效果

在这里插入图片描述

注意:移植时要注意的点
1.要在ui.h文件里声明新定义的字体
在这里插入图片描述
2.这里是UTF-8格式内容看不到但是有
在这里插入图片描述

  • 12
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值