技能冷却图标实现（实践篇-MeshFilter and Mesh）

在开始实现冷却效果之前，我们得先了解 Mesh即网格对象以及我们所要用到的3个变量

Mesh.vertices    网格顶点

Mesh.triangles   三角形

Mesh.colors      顶点颜色

在使用Mesh之前 我们需要先获得Mesh的实例才能对其进行操作，

所以这里我们需要用到MeshFilter，

因为需要在旋转时对Mesh对象进行操作，所以我们采用的必须为MeshFilter.sharedMesh即共享网格

给Icon对象添加MeshFilter组件，在Start方法里创建共享网格meshFilter.sharedMesh = new Mesh();

注：下文所操作的Mesh皆为meshFilter.sharedMesh

根据第一章我们的分析得出 我们需要8个三角形及10个顶点

所以这里我们需要申明10个网格顶点

Mesh.vertices=new Vector3[10];

根据图分析 各个点之间是有一定规则排列的 0点为中心 其他点则围绕0点绕一圈，我们这里假设Icon的高度和宽度为1 ，则顶点坐标数据声明如下

Mesh.vertices[0] = new Vector3(0.0f, 0.0f, 0.0f);

        Mesh.vertices[1] = new Vector3(0.0f, halfHeight, 0.0f);

        Mesh.vertices[2] = new Vector3(halfWidth, halfHeight, 0.0f);

        Mesh.vertices[3] = new Vector3(halfWidth, 0.0f, 0.0f);

        Mesh.vertices[4] = new Vector3(halfWidth, -halfHeight, 0.0f);

        Mesh.vertices[5] = new Vector3(0.0f, -halfHeight, 0.0f);

        Mesh.vertices[6] = new Vector3(-halfWidth, -halfHeight, 0.0f);

        Mesh.vertices[7] = new Vector3(-halfWidth, 0.0f, 0.0f);

        Mesh.vertices[8] = new Vector3(-halfWidth, halfHeight, 0.0f);

        Mesh.vertices[9] = new Vector3(0.0f, halfHeight, 0.0f);

这里的halfWidth和halfHeight即宽高的一半，通过这两个值可以获得我们所需要的几个顶点位置，不理解的朋友可以位置和图片对比下进行理解。

顶点创建完毕，依旧看上面的图片进行分析，得出各个三角形，对Mesh.triangles进行赋值

mesh.triangles = new int[]{

            0,1,2,

            0,2,3,

            0,3,4,

            0,4,5,

            0,5,6,

            0,6,7,

            0,7,8,

            0,8,9

        };

    }

对照图片可以清晰的理解这个数据声明原理，这里不再赘述。

顶点和三角形赋值完毕后 对各个顶点颜色进行赋值，因颜色可能各个icon的需求不同 所以这里给脚本定义一个外部传入参数 public Color color;

将传入颜色赋值给Mesh的各个顶点

Color[] colors = new Color[mesh.vertices.Length];

        for (int i = 0; i < colors.Length; ++i)

        {

            colors[i] = color;

        }

        mesh.colors = colors;

  

至此，实现效果的Mesh对象初始化数据就完成了，后续的实现，敬请期待。