👉即将学会
了解到Unity发布WebGL,可能遇到的问题以及解决方法。
👉背景
今天小芝🙎和小空🙈今天一起吃了昨天的剩饺子+泡面,更穷了!
👉实践过程
问题一
Text字体不清晰
第一种可能是图片拉伸的问题,Text控件长或宽被拉伸,导致单位面积像素点减少了(好像是称为像素密度),解决是对其scale进行成倍放大而不是对其拉伸
第二种 如果Canvas模式是一般相机模式(前两种),把Canvas Scaler的Scale Factor适当调大,字体会变清晰;
还有就是Canvas是World模式, 可以把Canvas Scaler的Dynamic Pixels Per Unit适当调大,这样Text每单元的动态pixels会增大,这样vr中的3DText字体会变的清晰。
问题二
Text文字组件实现滑动变色
解决:添加Selectable组件就行
问题三
给UGUI精灵或按钮 添加自定义事件响应区域
所有UI都有Image组件,其中有RaycastTarget属性,勾选该属性为true则表示运行时UI精灵会响应相应交互事件,这套UGUI(包括NGUI)是通过射线检测实现的交互响应,那么我们可以通过添加可编辑碰撞器的方式,修改Image默认检测区域;
项目中我的按钮是这样的
如果你不做处理 默认是整张图片(即空白区域)都会响应,体验上是不太好的;
Unity给我们提供了自定义区域,就是 PolygonCollider2D组件
点击EditCollide会有小绿点出现让你编辑该多边形碰撞器(将区域设置有图片内容的区域);
还有我们要删除button原有的Image组件,新建一个C#类且继承自Image,把这个C# 添加给button,设置图片即可
using UnityEngine; using System.Collections; using UnityEngine.UI; public class CustomBtnArea : Image { public override bool IsRaycastLocationValid(Vector2 screenPoint, Camera eventCamera) { return GetComponent<PolygonCollider2D>().OverlapPoint(screenPoint); } } 复制代码
官方的Image原生方法是这样的
跑起来,只有圈出的区域才响应
问题四
鼠标滑过UI检测碰撞位置,来实现提示信息;
注意:是UI(2D)内容的碰撞,当然3D的也有;
using UnityEngine; using System.Collections; using UnityEngine.EventSystems; using UnityEngine.UI; //https://juejin.cn/user/4265760844943479/posts public class BtnTips : MonoBehaviour, IPointerExitHandler, IPointerEnterHandler { public bool isShowTip; //是否展示提示 private string name;//物品名称 public Font this_font; //字体样式,方便显示中文 void Start () { isShowTip = false; } void Update () { } //这段注释的 是 3D物体的检测 //private void OnMouseEnter() //{ // Debug.Log("鼠标位置"); // isShowTip = true; //} //private void OnMouseExit() //{ // isShowTip = false; //} private void OnGUI() { if (isShowTip) { //Debug.Log("鼠标位置==="); GUIStyle style1 = new GUIStyle(); style1.fontSize = 20; style1.normal.textColor = Color.white; //style1.normal.textColor = new Color(0,0,0); //可以自定义任何颜色 style1.font = this_font; //自定义字体样式 GUI.Label(new Rect(Input.mousePosition.x, Screen.height - Input.mousePosition.y-20, 140, 60), name,style1); } } //下面是 2D UI 内容的鼠标划入检测 public void OnPointerExit(PointerEventData eventData) { isShowTip = false; name = ""; } public void OnPointerEnter(PointerEventData eventData) { isShowTip = true; name = gameObject.transform.GetChild(0).GetComponent<Text>().text; } } 复制代码
问题五
Button组件设置不可点击且变灰,发现单纯的颜色按钮是可以的,如果是Button是精灵的就不行,目前只能是恰当的时机替换精灵 如设置不可点击enabled=false的时候把精灵替换成灰色图;反之一样
问题六
如果项目中Text组件多,且是中文,一个一个修改字体样式肯定劳神, 可一键替换字体样式资源,属于自定义编辑器的知识(EditorWindow) 注:过程中如果字体样式多样化 一定要注意,别全替换了;
using UnityEngine; using System.Collections; using UnityEditor; using UnityEditor.SceneManagement; using UnityEngine.UI; //https://juejin.cn/user/4265760844943479/posts public class ChangeFontWindow : EditorWindow { [MenuItem("Tools/更换字体")] public static void Open() { EditorWindow.GetWindow(typeof(ChangeFontWindow)); } Font toChange; static Font toChangeFont; FontStyle toFontStyle; static FontStyle toChangeFontStyle; void OnGUI() { toChange = (Font)EditorGUILayout.ObjectField(toChange, typeof(Font), true, GUILayout.MinWidth(100f)); toChangeFont = toChange; toFontStyle = (FontStyle)EditorGUILayout.EnumPopup(toFontStyle, GUILayout.MinWidth(100f)); toChangeFontStyle = toFontStyle; if (GUILayout.Button("更换")) { Change(); } } public static void Change() { Transform canvas = GameObject.Find("Canvas").transform; if (!canvas) { Debug.Log("NO Canvas"); return; } Transform[] tArray = canvas.GetComponentsInChildren<Transform>(); for (int i = 0; i < tArray.Length; i++) { Text t = tArray[i].GetComponent<Text>(); if (t) { //这个很重要,博主发现如果没有这个代码,unity是不会察觉到编辑器有改动的,自然设置完后直接切换场景改变是不被保存 //的 如果不加这个代码 在做完更改后 自己随便手动修改下场景里物体的状态 在保存就好了 Undo.RecordObject(t, t.gameObject.name); t.font = toChangeFont; t.fontStyle = toChangeFontStyle; //相当于让他刷新下 不然unity显示界面还不知道自己的东西被换掉了 还会呆呆的显示之前的东西 EditorUtility.SetDirty(t); } } Debug.Log("Succed"); } } 复制代码
使用把这个c#放到你的项目中,最后在tool中打开
搞定!
作者:芝麻粒儿
链接:https://juejin.cn/post/6996989694856658957
来源:稀土掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
👉其他
📢作者:小空和小芝中的小空
📢这位道友请留步☁️,我观你气度不凡,谈吐间隐隐有王者霸气💚,日后定有一番大作为📝!!!旁边有点赞👍收藏🌟今日传你,点了吧,未来你成功☀️,我分文不取,若不成功⚡️,也好回来找我。