美文网首页
Android 应用 IconFont

Android 应用 IconFont

作者: badmask | 来源:发表于2018-09-30 17:15 被阅读0次

    问题

    下面是两张对比图:

    直接把【写入 textview中.png
    设计童鞋想要的效果.png

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

    如何使用

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

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

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

      <string name="iconfont_brackets_left">\ue901</string>
      <string name="iconfont_brackets_right">\ue902</string>
    

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


    向Android 项目中加入资源文件 iconfont.ttf.png

    IconFont到底是什么

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

    如何获取ttf资源文件

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

    阿里巴巴矢量图标库的购物车界面.png
    下载后打开显示的内容.png
    每个图标对应的unicode编码.png

    缺点

    图片只能显示纯色;

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

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

    相关文章

      网友评论

          本文标题:Android 应用 IconFont

          本文链接:https://www.haomeiwen.com/subject/pewwoftx.html