[UGUI]Text文字效果

参考链接：

http://www.xuanyusong.com/archives/3471

https://www.cnblogs.com/lyh916/p/9162463.html

https://www.cnblogs.com/zsb517/p/6565446.html

0.Text的顶点分布

 using System.Collections.Generic;
 using UnityEngine;
 using UnityEngine.UI;

 public class TestMesh : BaseMeshEffect {

     public override void ModifyMesh(VertexHelper vh)
     {
         List<UIVertex> vertexs = new List<UIVertex>();
         vh.GetUIVertexStream(vertexs);
         for (int i = ; i < vertexs.Count; i++)
         {
             Debug.LogWarning(vertexs[i].position);
         }

         print(vertexs.Count);
         print(vh.currentIndexCount);
         print(vh.currentVertCount);
     }
 }

新建一个text，然后使内容保留至一个字，添加上面的脚本。可以发现，1个字有4个顶点，而顶点的排列如下图。1个字由2个三角形组成，绘制顺序为0-1-2和2-3-0，顺时针绘制。

1.渐变效果

 using System.Collections.Generic;
 using UnityEngine;
 using UnityEngine.UI;

 [AddComponentMenu("UI/Effects/Gradient")]
 public class Gradient : BaseMeshEffect
 {
     [SerializeField]
     private Color32 topColor = Color.white;
     [SerializeField]
     private Color32 bottomColor = Color.black;

     public override void ModifyMesh(VertexHelper vh)
     {
         List<UIVertex> vertexs = new List<UIVertex>();
         vh.GetUIVertexStream(vertexs);
         for (int i = ; i < vertexs.Count;)
         {
             SetVertexColor(vertexs, i, topColor);
             SetVertexColor(vertexs, i + , topColor);
             SetVertexColor(vertexs, i + , bottomColor);
             SetVertexColor(vertexs, i + , bottomColor);
             SetVertexColor(vertexs, i + , bottomColor);
             SetVertexColor(vertexs, i + , topColor);
             i += ;
         }
         vh.Clear();
         vh.AddUIVertexTriangleStream(vertexs);
     }

     private void SetVertexColor(List<UIVertex> vertexs, int index, Color32 color)
     {
         UIVertex vertex = vertexs[index];
         vertex.color = color;
         vertexs[index] = vertex;
     }
 }

2.阴影效果

UGUI自带Shadow脚本，可以下载UGUI源码查看其实现。新建一个Text并添加Shadow组件，将effectDistance距离调大，如下图。其中白字是自身，黑字是阴影效果，可以看到，阴影效果就是将顶点复制一份，然后向某一方向移动位置。

3.描边效果

UGUI自带Outline脚本，Outline继承Shadow，换言之，其实现与Shadow类似。新建一个Text并添加Outline组件，将effectDistance距离调大，如下图。其中白字是自身，黑字是描边效果，可以看到，描边效果就是将顶点复制四份，然后向四个方向移动位置。