1.1　原理

首先得生成显示UI用的Mesh，如图1-1所示，一个矩形的Mesh，由4个顶点，2个三角形组成，每个顶点都包含UV坐标，如果需要调整颜色，还需要提供顶点色。就像UGUI中调节图片和文本的颜色，其实就是设置它们的顶点色而已。

图1-1 网格

然后将网格和纹理信息送入GPU中渲染，如图1-2所示一个最简单的UI元素就渲染出来了。如果再继续排列组合其他的UI元素，那么一个游戏界面就诞生了。所谓的UI其实就是用一个正交摄像机端端地看着若干个平面网格。

图1-2渲染

以上只是UI的最基本的显示原理，虽然这样是可以拼出来UI的，但是我们是无法应用在游戏中的。比如，DrawCall需要合并，UI的点击操作事件、UI基础组件等等，所以就诞生了伟大的UGUI。带着界面打开慢和界面操作慢的两个问题，我们开始分析UGUI的源码来寻找一些答案。

更多内容可以前往《UGUI深度研究之源码鉴赏》查看。

由于部分源码较长，为了不影响大家阅读我会删除一些无用的代码段，仅保留重要的代码段。

文章简介

从UI的代码底层讲起，通过理解底层代码的原理来认知上层的有效优化方法。这里会从源码中深入分析UI网格重建的实现原理，并完成了提取触发UI重建的UI元素的代码实现，可以更方便更准确地定位引起UI性能问题的UI元素，从而有针对性地做优化。

而在分析Image、Text、Layout等部分源码的同时，也提出使用的注意事项。使开发者在UGUI制作及性能优化方面，更好地达到“知其然，知其所以然”的效果。

“UI开销如何优化？”、“如何定位引起重建的UI元素？”、“UGUI Text如何进行优化？”、“如何合理使用Layout？”、“在设置UI点击事件时有哪些注意事项？”等等这些常见的UI开发问题，都可以在这个专栏中得到解答。不管是行业新人，还是Unity从业者，都不妨来一起领略一番UGUI源码，相信都会有所收获。

适合读者

1、Unity项目性能优化工程师

2、Unity项目UI工程师

3、希望对UGUI深入了解的读者

你将获得

1、UGUI开源底层代码的原理

2、UI网格重建的实现原理

3、引起UI性能问题的UI元素定位方法