在ttf字体包中添加图标字符,图标字体化

在app项目的开发中,遇到需求,将在文本中混排较多的小图标,通用的实现图文混排的方法在适配问题上遇到较大的问题,因此想到将图标字体化。

需求:在字体包中添加特殊的图标字符

原料及工具:

1.png单色图片一张(最后要显示作图标字符的图片,必须是单色图片);待添加特殊图片字符的ttf字体包;

2.线上工具http://www.pngtosvg.com/(将png图转换为svg格式);

3.线上工具:https://icomoon.io(文档:https://icomoon.io/#docs);使用参考博客:http://blog.csdn.net/yyh352091626/article/details/53113677;该网站提供了丰富的图标字体,可以下载使用。我在这里利用了其生成字体的功能,它还可以对字体图片进行简单的编辑,如大小,字体方格中的位置等。

4.使用Font Creator Program

步骤:

1.使用线上工具2将png图片转换为pvg格式;

2.使用线上工具3在icomoon.io上新建project-------load------等步骤,然后修改其中一个字符,替换其图片为步骤1中的svg图片;然后create  font下载生成的字体,即得到一个ttf字体包,里面包含了所需要的字符;(参考上述的文档及博客说明)

3.使用工具4,使用插入+复制+特殊粘贴的方式将字符拷贝到待添加图片字符的字体包中;另存文件导出新的ttf字体包,大功告成;


由于对字体还不了解,只能摸着石头过河。很多概念和其中的原理都不甚了解,以上的做法比较曲折,可能有绕弯子的地方。但也的确解决了眼前的问题。


你可能感兴趣的:(在ttf字体包中添加图标字符,图标字体化)