<Unity-UGUI>扩展UGUI控件,添加折线控件

来源:互联网 发布:农村淘宝和快递公司 编辑:程序博客网 时间:2024/05/22 03:16

扩展UGUI控件,添加折线控件

由于某个需求,我需要在UGUI下添加一个控件,该控件的功能就是具备依据输入的数据绘制一段折线,并且该折线可以被UGUI的Mask控件正确裁减。
由于是第一次扩展Unity自带的UI系统,我根据需求 需要解决如下几个问题:
1 如何让我的控件被UGUI的Mask正确裁减
2 如何绘制折线

如何让我的控件被UGUI的Mask正确裁减

通过查找UGUI自带控件RawImage的实现方式,得知我需要从MaskableGraphic继承。并且重载必要的函数便可以让自定义的控件被Mask正确裁减。需要重载OnFillVBO,才可以自定义控件的形状等,如下。

/// <summary>/// Fill the vertex buffer data./// </summary>protected virtual void OnFillVBO(List<UIVertex> vbo){    var r = GetPixelAdjustedRect();    var v = new Vector4(r.x, r.y, r.x + r.width, r.y + r.height);    var vert = UIVertex.simpleVert;    vert.color = color;    vert.position = new Vector3(v.x, v.y);    vert.uv0 = new Vector2(0f, 0f);    vbo.Add(vert);    vert.position = new Vector3(v.x, v.w);    vert.uv0 = new Vector2(0f, 1f);    vbo.Add(vert);    vert.position = new Vector3(v.z, v.w);    vert.uv0 = new Vector2(1f, 1f);    vbo.Add(vert);    vert.position = new Vector3(v.z, v.y);    vert.uv0 = new Vector2(1f, 0f);    vbo.Add(vert);}

需要注意的是上段代码所示是UnityEngine.UI 4.6版本,在5.0及以后版本则不存在该方法,需要重载的是

//5.2 versionprotected virtual void OnPopulateMesh(VertexHelper vh)

该版本较之4.6的当然更友好,更方便。4.6的OnFillVBO只允许输入4的倍数个正确顶点,并且会使用每4个点绘制一个四边形,才可以正确的绘制出形状,对于一般UI仅仅是需求一个普通的四边形来说足够了,但是如果我有更多的需求,那就很麻烦,比如我要扩展一个圆形的控件。

如何绘制折线

我目前是使用的4.6版本的UGUI,所以我必须在OnFillVBO中用一个个的四边形来拼出折线,而在5.0+版本中可以使用正常的三角形顶点索引的方式绘制。但是无论怎样,依据输入的路径来绘制折线的基本算法是一样的。
<待续>

1 0