NGUI 渲染组件:UIBasicSprite\UITexture

目录：​NGUI源码学习​ 

UIBasicSprite: 所有图片绘制的父类.

提供Sample\Slider\Tiled\Filled等填充类型的填充方法，主要是填充geometry.verts, geometry.uvs, geometry.cols，然后再UIPanel的FillAllDrawCalls、FillDrawCall方法里填充给对应的DC。

调用路径：UpdateGeometry-OnFill-Fill。

子类的OnFill负责处理图片的九宫格内外矩形，Fill负责根据Type(sample/slider等)填充geometry的顶点、uv、颜色信息，最终geometry的這些信息会被填充到当前对象的UIDrawCall里，并最终设置Mesh进行显示(一个DC对应一个Mesh对象)。

 

 

NGUI的图片(精灵、Texture)都是通过矩形的Mesh显示的，每个mesh由至少4*1(区域，例如Sliced为9块，Tiled为math.ceil(widget. width/tex.width) *math.ceil(widget.heght/tex.height))个顶点构成，每个顶点有坐标、uv（改坐标在对应贴图上的位置）、颜色等属性。UIBasicSprite提供了计算这些顶点的方法。

UIBasicSprite:UISprite/UI2DSprite/UITexture/UIMixWidget.
        property:
        mInnerUV:矩形纹理信息，(0,1)的uv坐标，实际是九宫格的内边界,一般是(border.x/tex.width, border.y/tex.height, (tex.width-border.z)/tex.width, (tex.height-border.w)/tex.height)
        mOuterUV:矩形纹理信息，(0,1)的uv坐标，实际是九宫格的外边界,一般是(0,0,1,1)
        centerType/flip/fillDirection:显示相关的参数
        fillAmount:填充百分比,Filled模式下有效
        invert:反向显示
        border:Sliced模式下，图片对应的九宫格
        minWidth/minHeight:最小宽高
        
        function:
        Fill:填充数据
        SimpleFill:Type.Simple.普通填充，把四个点填充到dc的verts、uvs、cols
        SlicedFill:Type.Sliced.九宫格填充，共4*9=36个顶点
        TiledFill:Type.Filled.重复平铺，不拉伸
        AdvancedFill:Type.Advanced
        AddVertexColours:处理gradient效果，实际是拿4个点的颜色值*对应的Gradient值(mGradientBottom或mGradientTop)

填充方法参考：

​Unity动态渲染一个Mesh​ 

https://blog.csdn.net/qq_26958473/article/details/102785658

 

Sample\Slider\Tiled\Filled等区别：https://www.cnblogs.com/zhaoqingqing/p/3554180.html

UITexture:大图展示，对应一个DC，无法合批。

你可以把Simple的UITexture当成渲染一个Mesh，你只要设置Mesh的坐标、长宽(四个顶点坐标确定)，四个顶点的uv值、颜色，贴图、材质(DrawCall处理)，就可以把一张Texture显示在unity屏幕上。

Mesh mesh = new Mesh();

mesh.vertices = newVertices;

mesh.uv = newUV;

mesh.triangles = newTriangles;//决定正反面

mesh.name = "NGUI Test";

mFilter.mesh = mesh;

主要是调用OnFill填充geometry。

UITexture:UIBasicSprite
        property:
        mainTexture/material/shader/border:纹理、材质等渲染信息
        drawingDimensions:计算渲染区域，通过mWidth、mHeight计算
        
        function:
        MakePixelPerfect:像素修改，奇数修正成偶数值
        OnFill:填充geometry

//锚点
Vector2 offset = pivotOffset;
 
float x0 = -offset.x * mWidth;
float y0 = -offset.y * mHeight;
float x1 = x0 + mWidth;
float y1 = y0 + mHeight;
drawingDimensions =  new Vector4(x0, y0, x1, y1);

核心方法:OnFill。如果是九宫格，会计算mInnerUV、mOuterUV供九宫格填充使用。最终会调用

Fill(verts, uvs, cols, outer, inner)填充geometry。

public override void OnFill (List<Vector3> verts, List<Vector2> uvs, List<Color> cols)
   {
      Texture tex = mainTexture;
      if (tex == null) return;
 
      Rect outer = new Rect(mRect.x * tex.width, mRect.y * tex.height, tex.width * mRect.width, tex.height * mRect.height);
      Rect inner = outer;
      Vector4 br = border;
      inner.xMin += br.x;
      inner.yMin += br.y;
      inner.xMax -= br.z;
      inner.yMax -= br.w;
 
      float w = 1f / tex.width;
      float h = 1f / tex.height;
 
      outer.xMin *= w;
      outer.xMax *= w;
      outer.yMin *= h;
      outer.yMax *= h;
 
      inner.xMin *= w;
      inner.xMax *= w;
      inner.yMin *= h;
      inner.yMax *= h;
 
      int offset = verts.Count;
      Fill(verts, uvs, cols, outer, inner);
 
      if (onPostFill != null)
#if OPTIMISE_NGUI_GC_ALLOC
         //because we might change geometry's verts uvs cols value in Fill
         onPostFill(this, offset, geometry.verts, geometry.uvs, geometry.cols);
#else
         onPostFill(this, offset, verts, uvs, cols);
#endif
   }