1 概述

最近项目中要添加表情包聊天的功能(文本和表情包要混合在一起)，最直接的解决方案应该就是图文混排，对于这个方案网上有很多的实现，图文混排实现起来比较麻烦，而且和服务端交互的时候还要将图片和与之对应的字符串之间进行变换，对于有追求的我来说，这个方案我是无法接受的，因此直接被否定；表情包是用来聊天的，如果每一个表情包可以看着是一个英文字符，那样实现起来岂不是完美，既不用考虑与服务端的交互，也不用像图文混排那样写自定义的图文混排控件(直接使用TextView和EditText就行)，那么用表情包图片生成与之对应的字体库就是最好的解决方案，第一时间想到的就是iconfont，如下图所示：

顾名思义就是图形字体，但是遗憾的对于Android开发只有黑白的，没有彩色的，因此被否定了，然后就开始通过Google搜索解决方案，最终找到了Google提供的解决方案color-emoji，也就是最终采取的解决方案。

color-emoji用到的字体库是TTF(TrueType fonts)字体库，TrueType是Apple和Microsoft在20世纪80年代后期开发的轮廓字体标准，作为在PostScript中使用的Adobe的 Type 1 fonts的竞争对手。 它已成为macOS和Microsoft Windows操作系统上最常用的字体格式。TrueType的主要优势在于它为字体开发人员提供了对字体显示精确程度的高度控制(小到到特定像素、各种字体大小)。 由于目前使用的渲染技术差异很大，因此不再需要TrueType字体中的像素级控制。TrueType字体中的字符（或字形）的轮廓由直线段和二次贝塞尔曲线组成。

Apple已经实现了一个专有扩展，为其emoji字体Apple Color Emoji提供彩色的.ttf文件；在iOS 5之前，使用SoftBank编码在Apple设备上编码emoji。 从iOS 5开始，emoji使用Unicode标准进行编码。emoji字形存储为PNG图像，后来在OpenType1.8版本中进行了标准化。

在Apple Color Emoji推出多年之后，在2013年，Google终于也推出了自己的开源Color Font标准：Open Standard Font Fun for Everyone ，Google同样实现了OpenType的标准，并且提供了一个开源的实现：color-emoji。

说点题外话，表情包使我们的生活越来越生动，展示一下工作中的表情包：

我怎么这么好看，这么好看怎么办
憋说话，吻我
嘿嘿嘿
微微一笑很倾城
看看我的牙白吗

以上图片我会用在下面的例子中，让大家从欢笑中体验字体库的魅力。

2 color-emoji的使用

color-emoji是Google开源的工具，用来将png类型的图片生成字体库，首先下载在https://github.com/googlei18n/color-emoji地址下载源码，然后进入到color-emoji/examples/FruityGirl目录下,目录结构如下所示：

$ tree -L 2
.
├── FruityGirl.tmpl.ttx.tmpl
├── Makefile
└── png
    ├── F000.png
    ├── F001.png
    ├── F002.png
    ├── F003.png
    ├── F004.png
    ├── F005.png
    ├── F006.png
    ├── F007.png
    ├── F008.png
    ├── F009.png
    ├── F00A.png
    ├── F00B.png
    ├── F00C.png
    ├── F00D.png
    ├── F00E.png
    ├── F00F.png
    ├── F010.png
    ├── F011.png
    ├── F012.png

上面又一个Makefile的文件，这个文件编译过android系统源码的应该都很熟悉了，就是通过make命令来开始编译操作，png目录下的图片就是用来生成字体库的，图片的名称就是生成的字体库中与之对应的Unicode编号，将生成的字体库应用到TextView或者EditText上后，就可以使用该编号来显示对应的图片。

首先将目录中原来的png图片都删除掉，然后将上面五张表情包拷贝到png目录下，查了五个字(与上面的五张表情包惺惺相惜)的Unicode编码：傻(50BB)、吻(543B)、嘿(563F)、微(5FAE)、白(767D)。

执行make命令，然后看一下目录结构：

$ tree -L 2
.
├── FruityGirl.tmpl.ttf
├── FruityGirl.tmpl.ttx.tmpl
├── FruityGirl.ttf
├── Makefile
└── png
    ├── 50BB.png
    ├── 543B.png
    ├── 563F.png
    ├── 5FAE.png
    └── 767D.png

可以看到多了一个FruityGirl.ttf文件，这就是包含上面五张图片的字体库。

3 在Android中使用2中生成的字体库

举个例子，首先看一下运行效果：

上面截图中就是一个普通EditText控件，只不过是应用了2中生成的字体库，当输入傻、吻、嘿、微和白五个汉字时，就会显示上面的五张图片。

下面是实现代码：

Activity的布局文件：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="80dp">

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:textSize="36dp"
        android:fontFamily="@font/test"/>
</LinearLayout>

上图的test.ttf就是2中生成的字体库，在font_family.xml中配置完成后，用android:fontFamily应用到EditText上就可以了，是不是很简单，这才是我追求的解决方案。

注意：Unicode编号不能随便使用，因为有的编号已经被占用了，就像上面的例子中的五个汉字对应的编号就被占用了，所以就要知道那些范围的编号是可以自定义用的，用这个范围的编号作为表情包的编号就是安全的，下面是维基百科上给出的可以自定义编号的范围：

可惜的是 color-emoji只支持第一个范围中的编号，但是对于表情包来说已经足够了。