QT、qml 使用矢量图标字体库iconfont时 在linux或者Android下会显示乱码

环境

硬件：通用PC / 手机 / Jetson Xavier NX 套件
系统：Ubuntu 20.4 / Android / Windows
软件 ：QT5.12.9 + Qml
图标字体：阿里的矢量图标库

问题

​之前在Windows下时，使用阿里的iconfont.ttf没有任何问题。但是有次项目需要写一个Android端的app时，使用qml+iconfont的模式实现APP界面，结果在安卓端就出现图标全部显示异常（同样的代码在Windows端就不存在任何问题），所以将问题锁定在了图标字体库上。但是上次搞了很久都没有解决，最后被迫使用了svg显示图标，却一直耿耿于怀！！
这次，在linux下需要做界面开发，再次使用到iconfont，所有图标再次显示出错，我擦，这能忍？！

分析

前因

我开发QT程序，涉及界面开发时，我习惯性使用阿里的矢量图标库。使用方便、管理容易，能快速的开发出风格统一，较为美观的人机交互界面。

做嵌入式开发，之所以选择QT，主要就是看中它跨平台的能力，图标库现在跨不了，这能忍？必须解决！

分析

解决

0、FontCreator下载

1、创建自己的字体库

我创建了一个属于自己的字体adimecoin-Regular.ttf，此字体库不同于从阿里的矢量图标库直接下载的ttf，可以在linux 或者 Android下使用不乱码 adimecoin-Regular.ttf下载

2、加载字体库

//在main函数里，加入字体
QFontDatabase::addApplicationFont(QStringLiteral( ":/image/adimecoin-Regular.ttf"));

效果如下

3、qml使用字体库

//在QML里直接使用字体TabButton {font.pixelSize: APPSettings.smallButtonHeightfont.family: "adimecoin"text: qsTr("\uF4DC数据")}

在Ubuntu，运行效果如下：

参考：

1、在*ttf文件中添加字体图标
2、pkoretic/ionicons
3、Unable to use ttf icon font in QML

OK！
至此，问题解决。

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！