Android 应用 IconFont

问题

下面是两张对比图:

Android 应用 IconFont_第1张图片
直接把【写入 textview中.png

Android 应用 IconFont_第2张图片
设计童鞋想要的效果.png

实现图二的效果方式之一就是使用 IconFont。

如何使用

IconFont就是把图片做在字体文件(.ttf)中,每一张图片对应一个unicode码;
把字体文件放入 Android 的 assets 文件中;
对TextView进行设置:

   Typeface iconFont = Typeface.createFromAsset(mContext.getAssets(), "iconfont.ttf");
   tvWelfareTitle.setTypeface(iconFont);

将所需图片的对应unicode编码加入到strings文件中:

  \ue901
  \ue902

然后执行 setText 方法就可以了。


Android 应用 IconFont_第3张图片
向Android 项目中加入资源文件 iconfont.ttf.png

IconFont到底是什么

就是字体图标,看着是个图标【,但其实是个文字,在Android的TextView中使用,可以通过设置此TextView的颜色和大小来设置IconFont;
不用考虑图标适配问题;
比图标占用的空间小;
一套图标资源,可以在 Android、iOS、Web三端使用;

如何获取ttf资源文件

在阿里巴巴矢量图标库:http://www.iconfont.cn/ 里,可搜索到大部分的图标;
加入到购物车后,到购物车界面,点击「下载代码」按钮;
下载后打开将拿到的ttf文件加入到assets文件中;
打开demo_unicode.html文件,可以看到每个图标对应的unicode编码;

Android 应用 IconFont_第4张图片
阿里巴巴矢量图标库的购物车界面.png

Android 应用 IconFont_第5张图片
下载后打开显示的内容.png

Android 应用 IconFont_第6张图片
每个图标对应的unicode编码.png

缺点

图片只能显示纯色;

iOS使用IconFont时需要注意:
iOS使用IconFont时需要注意.png
参考链接

Android使用iconfont
iOS中iconfont(图标字体)的基本使用
不同语言在使用unicode 编码时的不同之处,下面这篇文章有我的粗略总结:学习-字符编码

你可能感兴趣的:(Android 应用 IconFont)