在iOS中使用字体文件.ttf(icon font,可缩放矢量图)

        icon font是一种可缩放的矢量图形,它相比图片大大节省了空间,而且在屏幕显示上的效果很好,不需要再为了适配而准备两套图了。

        首先你想要使用字体文件,需要有一套SVG图,这个图可以由美工提供,如果只给了png图,而你的公司又没有美工的话,自己转换吧,推荐一个可以将png图转换为SVG图的工具,就是inkscape。具体如何使用可以自行google。

        现在你有了一套svg图片,你需要把它变成.ttf的字体文件,这一步也是由美工来做的,没有或者美工不管的话自己来喽。首先你需要登录阿里巴巴矢量图片库网站,在google等搜索引擎查找即可。如下所示在iOS中使用字体文件.ttf(icon font,可缩放矢量图)_第1张图片

        然后点击图标管理,这块需要你登录一下,然后就可以上传你需要的图标了,注意上传的svg图标大小不能超过64kb。上传之后你可以对图标进行大小的修改。确认无误后点击你的图标,将它放入暂存架,放入成功的会自动变成橙色,如下所示

在iOS中使用字体文件.ttf(icon font,可缩放矢量图)_第2张图片

        将你需要的图标放入暂存架后,你就可以将他们下载到本地。里面会有自动转好的.ttf字体文件。点击打开.html文件,里面会有图标相对应的HTML实体字符码。下面就是在iOS中添加使用字体文件了。

1、将您IconFont刚下载的字体文件(.ttf)添加到工程中

 

2、打开Info.plist文件,增加一个新的Array类型的键,键名设置为UIAppFonts(Fonts provided by application),增加字体的文件名:“iconfont.ttf”

在iOS中使用字体文件.ttf(icon font,可缩放矢量图)_第3张图片

使用IconFont字体:

在iOS中使用字体文件.ttf(icon font,可缩放矢量图)_第4张图片


3、在iOS的Build Phases设置下的Copy Bundle Resource目录下添加你拖入的字体文件

在iOS中使用字体文件.ttf(icon font,可缩放矢量图)_第5张图片

需要注意的是创建 UIFont 使用的是字体名,而不是文件名;


文本值为 8 位的 Unicode 字符,我们可以打开 demo.html 查找每个图标所对应的


 HTML 实体 Unicode 码,比如:

 

"Z" 对应的 HTML 实体 Unicode 码为:

 

 

转换后为

 

\U0000e632

 

就是将&#x替换为 \U 中间用 0 填补满长度为 8 个字符


在iOS中使用字体文件.ttf(icon font,可缩放矢量图)_第6张图片


你可能感兴趣的:(HTML,iOS-UI界面)