// 每当在检视窗口修改纹理时,Unity都会触发UI元素的重新绘制。
{ if (m_Texture == value) return;
} public override Texture mainTexture
{ return m_Texture == null ? s_WhiteTexture : m_Texture;
接下来,我们要重写OnPopulateMesh()来执行渲染。该函数会获取VertexHelper工具辅助对象作为参数来构建网格。
辅助对象会跟踪顶点索引并添加顶点、UV和三角形,而且不必处理大量数组运算和索引跟踪。在构建新网格前,必须用Clear()函数处理该对象。
用于生成四边形的辅助函数AddQuad()非常实用,代码如下。
// AddQuad()是可以为UI网格轻松创建四边形的辅助函数。除此以外,你还可以用它来制作任何基于三角形的几何体
void AddQuad(VertexHelper vh, Vector2 corner1, Vector2 corner2, Vector2 uvCorner1, Vector2 uvCorner2)
{ var i = vh.currentVertCount;
UIVertex vert = new UIVertex();
vert.color = this.color; // 别忘了设置this
vert.position = new Vector2(corner2.x, corner1.y);
vert.uv0 = new Vector2(uvCorner2.x, uvCorner1.y);
vert.position = new Vector2(corner1.x, corner2.y);
vert.uv0 = new Vector2(uvCorner1.x, uvCorner2.y);
vh.AddTriangle(i+0,i+2,i+1);
vh.AddTriangle(i+3,i+2,i+0);
protected override void OnPopulateMesh(VertexHelper vh)
Debug.LogWarning("GridCellSize must be positive number. Setting to 1 to avoid problems.");
// UI元素RectTransform的左下角部分
var bottomLeftCorner = new Vector2(0,0) - rectTransform.pivot;
bottomLeftCorner.x *= rectTransform.rect.width;
bottomLeftCorner.y *= rectTransform.rect.height;
// 根据UI RectTransform,以现有GridCellSize尽可能放入多个方形网格平铺
for (float x = 0; x < rectTransform.rect.width-GridCellSize; x += GridCellSize)
{ for (float y = 0; y < rectTransform.rect.height-GridCellSize; y += GridCellSize)
bottomLeftCorner + x*Vector2.right + y*Vector2.up,
bottomLeftCorner + (x+GridCellSize)*Vector2.right + (y+GridCellSize)*Vector2.up,
Vector2.zero, Vector2.one); // UVs
Debug.Log("Mesh was redrawn!");
请注意,在AddQuad()函数中,我们设置了位置、UV和颜色。因为在UI材质中,纹理会默认乘以颜色。
保留默认设置,即(r=0,g=0,b=0,a=0),将会得到完全透明的材质。所以如果你无法看到UI部分,或许这就是原因所在。这里我们使用组件的继承颜色栏。
因为我们希望在RectTransform重新调整大小时更新网格,我们还要重写OnRectTransformDimensionsChange(),代码如下。
protected override void OnRectTransformDimensionsChange()
{ base.OnRectTransformDimensionsChange();
这样应该就好了。现在回到Unity场景,我们会在RectTransform中看到白色方形的网格。为了修改该效果,我们可以在Texture中选择并设置Unity默认纹理。
通过调整RectTransform的大小或Grid Cell Size数值,我们可以发现网格现在会自动更新。进入运行模式后,我们可以拖动滚动视图的内容,并正确地遮罩网格。
小结
本文介绍的功能不仅限于渲染四边形,因为我们在本文中创建的基本几何体包含三角形,所以任意2D网格应该都能绘制,而且它还可以用来设置动画。
更多Unity教程尽在Unity官方中文论坛(UnityChina.cn)!