• emoji表情多终端适配解决方案


    emoji表情多终端适配解决方案

    emoji,也叫 颜表情 是日本在无线通信中所使用的视觉情感符号,由栗田穰崇(Shigetaka Kurita)创作,并在日本网络及手机用户中流行。自苹果公司发布的ios5输入法中加入了emoji后,这种表情符号开始席卷全球,普遍应用于各种手机短信和社交网络中。ios8.3中,加入了同性家庭、以及对不同肤色人种的职业展示。ios9.1中,苹果加入了很多新的有趣的表情。ios10.0中,将大部分表情重新设计,同时加入了单亲家庭的emoji。

    emoji表情已经进入到我们的社交生活,大多数现代计算机系统已经兼容emoji表情。通过查阅相关资料,发现不同的设备对表情颜文字的展示效果不太一样。

    怎么样让emoji表情在每个客户端都能展示,并且有展示的一致性呢?

    方案是:将emoji表情改成图片的形式。

    展示方案的逻辑如下:

    (1)用户在设备中输入emoji

    (2)获取用户输入的unicode编码(每一个emoji表情都是一个或几个unicode编码组成,跟文字一样)

    (3)生成unicode编码对应的图片URL

    (4)前台根据URL以及手机分辨率,展示表情图片

    如何获取emoji表情对应的unicode码?

    用手机扫描这个二维码,在输入框中输入emoji表情,可以查看到对应的HTML实体,在这里HTML实体可以近似看成unicode编码。

    可以看到一些emoji表情并不是由单一的unicode码组成,而是有多个unicode码通过连接符号组成。

    最新Emoji画像取得的方法

    在ios9.1之后,有一个全新的网站 http://emojipedia.org/apple/ 可以在上面看到每个系统的高清表情图片。

     

    每一个子表情页面,可以看到每个手机系统不同的设计,还有表情的最新unicode编码。

    我们遍历每一个表情,下载图片和对应的unicode编码。

    同时对所有表情的unicode编码进行排序。因为表情历史版本众多,所以取一个没有用过的id段,从400,000开始累加。

    这样的我们生成一个表情unicode编码和图片id的对应表:

    当用户输入emoji表情的时候,获取到unicode编码,再输出它对应的图片id,就可以在前端展示出来

    例如:👧 这个unicode编码对应 从对应表可以查到它对应的图片id是e400459

    http://qzonestyle.gtimg.cn/qzone/em/e400459@2x.gif 生成这样的url给前台展示,并且针对二倍屏(高清屏)有高清图,对于pc有一倍图。

    过程就是:  1.输入表情字符----》&#x1F467  2.转成Unicode字符  -----》e400459   3.查询对应的id   ------》http://qzonestyle.gtimg.cn/qzone/em/e400459@2x.gif  4.拼接图片URL。

     总结:UTF8编码的Unicode格式不变,不同的设备显示不同的图片效果,为了能够让不同的设备兼容同一个效果,那么就需要将当前的设备的显示效果在此还原成UTF8编码的Unicode,在通过查找对应的id,找到自己的项目中对应的图片,拼装成URL展现在前端。

    注意MySQL数据库的储存类型:utf8mb4  (真正的UTF-8) ,  Emoji表情符号为4个字节的字符,而 utf8 字符集只支持1-3个字节的字符,导致无法写入数据库。

    MySQL的版本:utf8mb4的最低mysql版本支持版本为5.5.3+,若不是,请升级到较新版本。

    看过一篇文章,是这么解释的,mysql的作者早期在设计是时候是声称支持UTF8,后来没有支持成功,自己觉得很尴尬,没好意思说,后来偷偷的升级到了utf8mb4,没敢公开以前的utf8是假的UTF8,其实现在的utf8mb4才是真正意义上的UTF8编码格式。不管是真是假,微微一笑得了。呵呵...

    IOS 13.2于2019-10-28发行,增加了对性别中立选项的支持,人们以各种肤色握手,以及完全的Emoji 12.0Emoji 12.1兼容性。有关此更新的更多信息

    https://emojipedia.org/apple/ios-13.2/

     新版本IOS13.2收集了3175个表情符号

     

     emoji 表情 根据分类 查看:

     https://emojipedia.org/people/

    是不是应该进行这样的兼容?

    公司很小,还是建议先做自己的表情图片,大图的这种

     通过雪碧图或者自己写js实现,操作系统的emoji表情和Unicode这种方式图片太多,自己整理起来是个体力活,劳民伤财,而且每隔一段时间就更新,其实很难整理的完整。上边只是给的一种解决方法。实际上小公司人力根本达不到。

    所以还是建议采用自己做图片,向下面这种:

  • 相关阅读:
    基于windows server 2016和sqlserver 2016 AlwaysOn的群集配置
    Mysql基于Mysql Cluster+MysqlRouter的集群部署方案
    阿里云ECS部署Redis主备哨兵集群遇到的问题
    Informix数据库配置与连接
    Linux系统中Redis和Tomcat的PID文件路径设置
    Linux端口映射,80端口映射到8080端口
    Tomcat优化配置
    Tomcat配置自定义JAVA环境
    VMware虚拟机系统无法使用桥接联网
    PostgreSQL远程访问设置
  • 原文地址:https://www.cnblogs.com/gaogaoyanjiu/p/11780653.html
Copyright © 2020-2023  润新知