记一个Android使用IconFont导致的图标“乱码”问题

一转眼，好久都没有写文章了，项目也上线了，时间上稍微宽裕点了，也算是对目前工作的一个总结

问题描述

问题页面

乱码页面

正常页面

正常页面

问题页面来自一位客户的华为P9的手机

问题分析

当时客户的文字描述是App出现了乱码，继续深入了解后，客户提供了这个出现“乱码”的页面，开始还以为是文字乱码，没想到居然是图标出现了乱码，变成了一些类似偏旁部首的东西，因为还原不了这个bug出现的场景，就只能依靠猜测了。

• 第一感觉就是和我使用了Iconfont这个库有关系，如果使用了正常的png图片，不会出现这样的问题，但是出现问题的页面也有些古怪，这个页面全部都使用了IconFont，但仅仅只是部分图标出现了乱码，我在猜想是不是和我的使用IconFont的方式有关系，参考我之前写的Icon Font --Android图标也能轻松换肤，在下导航几个图标直接通过TextView 的setCompoundDrawablesWithIntrinsicBounds方式设置的，如下

 mBack.setCompoundDrawablesWithIntrinsicBounds(null,new IconicsDrawable(this)
                .icon(CustomFont.Icon.fon_arrow_left)
                .color(Color.WHITE)
                .sizeDp(24),null,null);

上面几个图标是通过ImageView的setImageDrawable方式设置的,代码如下

 mBack.setImageDrawable(new IconicsDrawable(this)
                .icon(CustomFont.Icon.fon_arrow_left)
                .color(Color.WHITE)
                .sizeDp(24));

我统统将实现方式改成了上面的代码，重新发了一个内测版的给客户发过去，但是很不幸，问题依旧。

• 猜想和特定的机型有关系，通过优测的云真机找到了和客户一模一样的机型，安装了之前的安装包，结果一点问题都没有。

• 猜想和客户手机里面安装的某些软件冲突导致的乱码，毕竟IconFont的本质就是将svg转换为ttf（字体文件），在通过api处理成Drawable对象，说不定和字符编码有关，但是这一点无法考证，没有看到客户的手机，即使是和第三方软件冲突，自己的程序还是要避免这些问题的。

• 猜想和字符编码有关，每一个IconFont都对应了一个字符编码，如下

        fon_arrow_left('\ue800'),
        fon_arrow_right('\ue801'),
        fon_password('\ue802'),
        fon_clean('\ue803'),
        fon_safe('\ue804'),
        fon_investment('\ue805'),
        fon_borrow_money('\ue806'),

可能是字符编码被占用了，通过修改字符编码或许能够避免这样的问题，但是还是有些担心这样的问题还会在一些特殊的情况下会出现，也管不了那么多了，我决定试试这个方案，打开了fonthello这个网站来修改字符编码（当然也可以使用其他的字体编辑器），惊喜的发现这些“乱码”的来源，如下图

修改前

没有出现乱码的图标是没有对应的字符集的，举一个例子IE的图标对应了一个“”字符，而笑脸的图标没有对应任何字符就一个“”，这样就对上了，没有出现乱码的图标是没有对应的字符的，按照这个思路，将字符编码手动指定后变成了这样：

修改后

代码中的编码也要对应修改，这里暂不赘述了

改完之后又重新发了一个安装包给客户，乱码问题终于告一段落。

总结

使用了这么久的IconFont，第一次遇到了这样奇葩的问题，折磨了我好几天，差点准备将所有图标换成png的来解决问题，终于问题还是解决了，总而言之，IconFont的好处还是蛮多的，不能因为一点问题就完全放弃的，还有google和百度都没搜索到这个问题的答案，于是才有了这篇文章，分享给大家。

欢迎转载，转载请注明原文链接，谢谢配合！！