Image
Image继承了MaskableGraphic, ISerializationCallbackReceiver, ILayoutElement, ICanvasRaycastFilter,提供了四种ImageType:Simple(普通)、Sliced(切割)、Tiled(平铺)、Filled(填充)。继承了ILayoutElement是一个布局元素,可以被各种布局组(ILayoutGroup)所包含,将它和其他布局元素进行布局。
OnPopulateMesh方法
重写Graphic的OnPopulateMesh方法,会在Graphic的Rebuild方法被调用,为CanvasRenderer的Mesh提供了顶点位置、顶点颜色、UV和三角形信息。根据图片设置的不同类型,生成不同的顶点、顶点颜色、UV和三角形信息。
Simple:
GenerateSimpleSprite方法
- 根据activeSprite的padding和RectTransform大小,重新计算顶点。
- 根据activeSprite的外侧UV信息GetOuterUV,设置UV。
- 把顶点,颜色,UV和三角形信息存入VertexHelper中。
Sliced:
GenerateSlicedSprite方法
- 生成36个uv点,九宫格里每一个格子对应4个uv点。
- 生成36个顶点,九宫格里每一个格子对应4个顶点。
- 中心区域被拉大,四角部分不变。当取消Image上的Fill Center的时候,中间区域变透明,这是因为中间区域顶点、UV等信息都没有。
Tiled:
GenerateTiledSprite方法
如果sprite有边界,那么便会生成跟GenerateSlicedSprite一样的结果,如果没有边界,那么就会在该区域内填充多个sprite,GenerateTiledSprite会计算该区域里可以放下多少个精灵单元(横纵分别向上取整),假设为格子数N,便会有4N个顶点,如果一个小格子可以完整的放下一个精灵单元,uv值便是x从0到1,y从0到1的完整纹理坐标。而如果只能放下一部分,那边根据百分比计算uv值。
Filled:
GenerateFilledSprite方法
区分了不同的填充方法(Horizontal,Vertical,Radial 90,Radial 180,Radial 360)
Horizontal和Vertical填充方法
根据m_FillOrigin(填充的起点)和m_FillAmount(填充的值),设置顶点和UV。
Radial系列方法
调用RadialCut方法,调整指定的四边形,使其径向填充。然后调用AddQuad方法,设置顶点,颜色和UV。
除了继承MaskableGraphic,还继承了ISerializationCallbackReceiver, ILayoutElement, ICanvasRaycastFilter。
ISerializationCallbackReceiver需要实现OnBeforeSerialize(序列化之前)和OnAfterDeserialize(序列化之后)两个方法。Image的OnBeforeSerialize是个空方法,OnAfterDeserialize里则是矫正了Fill Origin和Fill Amount为有效值。
ILayoutElement是布局元素,需要实现一些属性(Property),用于调节尺寸大小时用到。
ICanvasRaycastFilter,它在Graphic中被调用,用于筛选出被射线照射到的图像。需要实现接口IsRaycastLocationValid。
IsRaycastLocationValid方法
将屏幕上的点转换为Image的RectTransform上的局部空间中的位置local,转换为以左下角为参考点的坐标系,归一化local,然后转换为纹理空间坐标,通过调用Texture2D .GetPixelBilinear取得以标准化坐标,返回的已过滤像素颜色,判断像素颜色的alpha值是否大于等于eventMinimumAlphaThreshold,我们可以外部修改这个值,例如改成0.5f,那么点击到alpha小于0.5f的像素点就无法接收事件。