Unity Emoji表情(图文混排)2022最详细教程

您所在的位置:网站首页 打出emoji表情 Unity Emoji表情(图文混排)2022最详细教程

Unity Emoji表情(图文混排)2022最详细教程

2024-06-27 09:20| 来源: 网络整理| 查看: 265

文章目录 前言一、emoji是什么?emoji (日本在无线通信中所使用的视觉情感符号) 二、使用步骤1.将源码文件导入自己的项目中步骤一:将Editor目录文件EmojiAtlasBaker移入到自己的项目Editor目录下步骤二、导入Icon到自己项目中 (EmojiAtlas 跟 QQIconAtlas可先删除掉,步骤五可生成图集及xml文件)步骤三、导入EmojiEffect跟EmojiTextManager脚本到项目Script目录下步骤四、在项目根目录下创建Xml文件夹,下面的两个文件是步骤五生成的文件,用于获取图集名称及信息步骤五、在Unity选线栏Tool->Bake Emoji Atlas会有这个选项,单击这个选项,会弹出以下界面(打包图集) 2.实际应用一、在初始化时读取调用XML文件二、服务器回调用户信息三、获取数据进行处理演示 三、项目运用后效果四、每天一心灵鸡汤

前言

在忙完项目以后,我又回来了,利用一些时间和心力去总结和思考一些东西。最近项目中玩家通过微信登录,登录后的微信昵称含有emoji表情,这样直接使用会显示乱码,C#无法直接处理,网上也没有比较好的解决方案,刚好找到了图文混排开源demo,顺便优化了一下脚本。

提示:以下是本篇文章正文内容,下面案例可供参考

一、emoji是什么? emoji (日本在无线通信中所使用的视觉情感符号)

绘文字(日语:絵文字/えもじ emoji)是日本在无线通信中所使用的视觉情感符号,绘指图画,文字指的则是字符,可用来代表多种表情,如笑脸表示笑、蛋糕表示食物等。在中国大陆,emoji通常叫做“小黄脸”,或者直称emoji

在NTTDoCoMo的i-mode系统电话系统中,绘文字的尺寸是12x12 像素,在传送时,一个图形有2个字节。Unicode编码为E63E到E757,而在Shift-JIS编码则是从F89F到F9FC。基本的绘文字共有176个符号,在C-HTML4.0的编程语言中,则另增添了76个情感符号。

自苹果公司发布的iOS 5输入法中加入了emoji后,这种表情符号开始席卷全球,emoji已被大多数现代计算机系统所兼容的Unicode编码采纳,普遍应用于各种手机短信和社交网络中。

表情符号Unicode表官网

二、使用步骤 1.将源码文件导入自己的项目中 步骤一:将Editor目录文件EmojiAtlasBaker移入到自己的项目Editor目录下

移入自己项目目录下

步骤二、导入Icon到自己项目中 (EmojiAtlas 跟 QQIconAtlas可先删除掉,步骤五可生成图集及xml文件)

*注意 Emojis跟QQ目录下的图片过多,打包项目时可存放到其他项目或者其他地方,减少打包的大小,这个两个目录的作用只是用于生成EmojiAtlas跟QQIconAtlas图集而已 导入Icon图标 Emojis目录下的图片 Emojis目录下的图片 QQ目录下的文件 QQ目录下的文件

步骤三、导入EmojiEffect跟EmojiTextManager脚本到项目Script目录下

导入脚本

步骤四、在项目根目录下创建Xml文件夹,下面的两个文件是步骤五生成的文件,用于获取图集名称及信息

xml目录

步骤五、在Unity选线栏Tool->Bake Emoji Atlas会有这个选项,单击这个选项,会弹出以下界面(打包图集)

路径为自己项目的路径 打包图集界面 (一)命名方法

Emoji表情XML命名: EmojiXml 图集命名: EmojiAtlas QQ表情XML命名: QQIconXml 图集命名:QQIconAtlas

设置好上面的参数。生成会把图片文件夹中的图片遍历打到一个Texture2D中,然后把每张图片在图集的位置大小记录下来,然后把这些数据存入xml文件中。在生成每个表情时可以设置UV来确定哪一个图片。 单击生成,会自动生成图集跟XML文件,见下图

(二)生成图集效果 生成图集 (三)生成XML配置文件 在这里插入图片描述 (四)XML配置文件内容 XML配置文件内容

2.实际应用 一、在初始化时读取调用XML文件 using System; using System.Collections; using System.Collections.Generic; using System.Text; using LitJson; using UnityEngine; using UnityEngine.UI; public class IndexPanel : BaseUI { public Text userNameTxt; # 定义图集参数并在预制体上绑定 public Texture emojiAtlas; public Texture qqIconAtlas; // Use this for initialization void Start(){ StartCoroutine(GetReadEmojiXml()); StartCoroutine(ReadIconXml()); } public static IEnumerator ReadIconXml() { string path = Application.streamingAssetsPath+"/Xml/QQIconXml.xml"; #if UNITY_EDITOR || UNITY_STANDALONE || UNITY_IOS path = "file://"+path; #endif WWW wWA=new WWW(path);///WWW读取在各个平台上都可使用 yield return wWA; XmlDocument XmlDoc = new XmlDocument(); // Debug.LogError("-----------------QQ表情配置内容:"+wWA.text); XmlDoc.LoadXml(wWA.text); XmlNodeList nodeList = XmlDoc.SelectSingleNode("root").ChildNodes; foreach (XmlElement xe in nodeList) { var resStr = string.Empty; resStr = xe["textTag"].InnerText + "|" + xe["rectX"].InnerText + "|" + xe["rectY"].InnerText + "|" + xe["rectWidth"].InnerText + "|" + xe["rectHeight"].InnerText + "|" + "0"; EmojiTextManager.Instance.ParseNormalIcon(resStr); } } public static IEnumerator GetReadEmojiXml(){ Debug.LogErrorFormat("---------------------Application数据路径为:"+Application.streamingAssetsPath); string path = Application.streamingAssetsPath+"/Xml/EmojiXml.xml"; #if UNITY_EDITOR || UNITY_STANDALONE || UNITY_IOS path = "file://"+path; #endif WWW wWA=new WWW(path);///WWW读取在各个平台上都可使用 yield return wWA; XmlDocument XmlDoc = new XmlDocument(); // Debug.LogError("-----------------Emoji表情配置内容:"+wWA.text); XmlDoc.LoadXml(wWA.text); XmlNodeList nodeList = XmlDoc.SelectSingleNode("root").ChildNodes; foreach (XmlElement xe in nodeList) { var resStr = string.Empty; resStr = xe["emojiFileNames"].InnerText + "|" + xe["rectX"].InnerText + "|" + xe["rectY"].InnerText + "|" + xe["rectWidth"].InnerText + "|" + xe["rectHeight"].InnerText + "|" + xe["textTag"].InnerText; EmojiTextManager.Instance.ParseEmojiInfo(resStr); } } }

在IndexPanel预制体上绑定图集跟EmojiTextManager脚本 脚本跟图集绑定

二、服务器回调用户信息 { "code": "20000", "data": { "phonePrefix": "+86", "ip": "111.111.11.111", "avatar": "group1/M00/00/10/rBKu4WHyN4GEfAhZAAAAAE40vZI779.jpg", "inGame": false, "userName": "\u8365\u9633\uD83D\uDE1A\u5154\u5154\uD83C\uDDE8\uD83C\uDDF3", "myInviteCode": "70436160", "token": "ffJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJub2NlIjoxNjQ1MjYwNTkwMDI1LCJ1c2VybmFtZSI6Iis4NjoxNTIxODk2ODMyMSJ9.CIDWw9B0IwoQQqwXcnLWkvpv8lZWdEu3-KXukQNM4ff", "hasThirdParty": false, "lastLoginTime": 1645260589987, "diamond": 8242, "phone": "11111111111", "gpsLat": "111", "inviteCode": "111111", "gpsLng": "111111", "connection": { "port": 00, "host": "11.111.111.1" }, "id": "70436160", "gpsLoaction": "\u7279\u6717\u666e\u5bb6", "status": 0 }, "message": "\u6210\u529F", "requestId": "1645260589", "url": "gateServer::/login" }

返回的json里面有userName,这里就是要处理的数据,可复制后面的Unicode字符串到Unicode编码转换开放平台上转换,转换结果如下: 转换结果

三、获取数据进行处理演示 using System; using System.Collections; using System.Collections.Generic; using System.Text; using LitJson; using UnityEngine; using UnityEngine.UI; public class IndexPanel : BaseUI { public Text userNameTxt; # 定义图集参数并在预制体上绑定 public Texture emojiAtlas; public Texture qqIconAtlas; // Use this for initialization void Start(){ StartCoroutine(GetReadEmojiXml()); StartCoroutine(ReadIconXml()); string userNameStr = "\u8365\u9633\uD83D\uDE1A\u5154\u5154\uD83C\uDDE8\uD83C\uDDF3"; # 传入方法中(参数: Text文本, Unicode字符串, 图集) EmojiTextManager.Instance.SetUITextThatHasEmoji(userNameTxt, usrNameStr, emojiAtlas); } public static IEnumerator ReadIconXml() { string path = Application.streamingAssetsPath+"/Xml/QQIconXml.xml"; #if UNITY_EDITOR || UNITY_STANDALONE || UNITY_IOS path = "file://"+path; #endif WWW wWA=new WWW(path);///WWW读取在各个平台上都可使用 yield return wWA; XmlDocument XmlDoc = new XmlDocument(); // Debug.LogError("-----------------QQ表情配置内容:"+wWA.text); XmlDoc.LoadXml(wWA.text); XmlNodeList nodeList = XmlDoc.SelectSingleNode("root").ChildNodes; foreach (XmlElement xe in nodeList) { var resStr = string.Empty; resStr = xe["textTag"].InnerText + "|" + xe["rectX"].InnerText + "|" + xe["rectY"].InnerText + "|" + xe["rectWidth"].InnerText + "|" + xe["rectHeight"].InnerText + "|" + "0"; EmojiTextManager.Instance.ParseNormalIcon(resStr); } } public static IEnumerator GetReadEmojiXml(){ Debug.LogErrorFormat("---------------------Application数据路径为:"+Application.streamingAssetsPath); string path = Application.streamingAssetsPath+"/Xml/EmojiXml.xml"; #if UNITY_EDITOR || UNITY_STANDALONE || UNITY_IOS path = "file://"+path; #endif WWW wWA=new WWW(path);///WWW读取在各个平台上都可使用 yield return wWA; XmlDocument XmlDoc = new XmlDocument(); // Debug.LogError("-----------------Emoji表情配置内容:"+wWA.text); XmlDoc.LoadXml(wWA.text); XmlNodeList nodeList = XmlDoc.SelectSingleNode("root").ChildNodes; foreach (XmlElement xe in nodeList) { var resStr = string.Empty; resStr = xe["emojiFileNames"].InnerText + "|" + xe["rectX"].InnerText + "|" + xe["rectY"].InnerText + "|" + xe["rectWidth"].InnerText + "|" + xe["rectHeight"].InnerText + "|" + xe["textTag"].InnerText; EmojiTextManager.Instance.ParseEmojiInfo(resStr); } } } 三、项目运用后效果

编辑器效果 编辑器效果 最终效果图 emoji效果图 创作不易,记得😍一键😚三连😘支持一下! 抱着键盘女孩

其他博客含有表情包的链接: 博客一:unity3d在UGUI中显示带表情的微信昵称 博客二:UGUI Text组件上动态显示Emoji

*注意: 源码文本长度不够会报错 GitHub源码地址:mcraiha/Unity-UI-emoji 博主优化后源码地址:Unity开发对Emoji表情包图文混排进行处理显示(支持大多数表情)

想了解更多,可以看一下csdn的Unity商业级Emoji表情系统-11.TexturePacker的简单使用教程(付费视频) 【其实本人也没看过🙈,哈哈~】

四、每天一心灵鸡汤

放下你的浮躁,放下你的懒惰,放下你的三分钟热度,放空你禁不住诱惑的大脑,放开你容易被任何事物吸引的眼睛,放淡你什么都想聊两句八卦的嘴巴,静下心来做你该做的事,该好好努力了!有时候真的努力后,你会发现自己要比想象的优秀很多。记住一句话,越努力,越幸运。 心灵鸡汤



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3