NGUI所见即所得之UIAtlasMaker , UIAtlas
本文的重点就是要将NGUI把多张图片打成一个图集（Atlas）的原理和过程研究下，学习下Unity提供的api和NGUI写的功能以及设计思想。
UIAtlas
在介绍UIAtlasMaker之前先看下，先看下UIAtlasMaker的产物——UIAtlas，在创建SPRite的时候都要指定UIAtlas，下面先对UIAtlas的代码：
C#代码
// Material used by this atlas. Name is kept only for backwards compatibility, it used to be public. [HideInInspector][SerializeField] Material material; // List of all sprites inside the atlas. Name is kept only for backwards compatibility, it used to be public. [HideInInspector][SerializeField] List<UISpriteData> mSprites = new List<UISpriteData>(); // Size in pixels for the sake of MakePixelPerfect functions. [HideInInspector][SerializeField] float mPixelSize = 1f; // Replacement atlas can be used to completely bypass this atlas, pulling the data from another one instead. [HideInInspector][SerializeField] UIAtlas mReplacement; // Whether the atlas is using a pre-multiplied alpha material. -1 = not checked. 0 = no. 1 = yes. int mPMA = -1; 可以很惊奇的发现UIAtlas的成员变量竟然极其精简，就只有：Material material; UISpriteDatat的List mSprites; 每个像素的大小 mPixelSize 这个跟UIWidget的像素大小应该是类似的， UIAtlas mReplacement; 这个目前只能望文生义，虽然知道是用来替换UIAtlas，但好像没有发现哪里会有用到，在UISprite的那里只是选择不同的UIAtlas而不是替换UIAtlas本身，就暂且搁置， 最后一个是mPMA这个是pre-multiplied的像素存储技术，大致了解下，好像是把alpha的值存储在每个颜色的RGB中去已达到节省存储空间的技术，想要了解更多可以自行google下。
接着看UIAtlas，接下来就是把属性的{get,set} 以及几个函数，也很简单，主要就是属性改变，就调用MakeAsDirty()函数，下面看下这个函数的前面一部分：
C#代码public void MarkAsDirty () { #if UNITY_EDITOR UnityEditor.EditorUtility.SetDirty(gameObject); #endif if (mReplacement != null) mReplacement.MarkAsDirty(); UISprite[] list = NGUITools.FindActive<UISprite>(); for (int i = 0, imax = list.Length; i < imax; ++i) { UISprite sp = list[i]; if (CheckIfRelated(this, sp.atlas)) { UIAtlas atl = sp.atlas; sp.atlas = null; sp.atlas = atl; #if UNITY_EDITOR UnityEditor.EditorUtility.SetDirty(sp); #endif } } …… } 可以看出这个函数其实就是更新以replacemet和this为UIAtlas的UISprite的UIAtlas，就是这么简单。
UISpriteData
在UIAtlas中有GetSprite()和GetListOfSprites()，其中GetSprite返回的UISpriteData，让人不得不猜想UISpriteData就是UISprite中的图片，但其实它只是一个结构体：
C#代码public class UISpriteData { public string name = "Sprite"; public int x = 0; public int y = 0; public int width = 0; public int height = 0; public int borderLeft = 0; public int borderRight = 0; public int borderTop = 0; public int borderBottom = 0; public int paddingLeft = 0; public int paddingRight = 0; public int paddingTop = 0; public int paddingBottom = 0; 一看这些成员变量，就会感觉很熟悉，这不是就是UI组件的基本熟悉么，可以进一步看下UIInspectorEditor界面，就更加确信了，而且Border其实用在SliceSprite的，至于Padding就是空白不显示区域，而且x,y,width,height其实该图片就是在UIAtlas上Rect区域。
也就是说，UISpriteData根本没有实际记录图片的像素信息，而只是记录图片在UIAtlas生成的那张大图的坐标，宽度和高度，以及图片拉伸的一些信息（Border,Padding）。
UIAtlasMaker
从前面的分析，可以大概知道UIAtlasMaker的原理：把多张图片合并成一张大图，记录每张图片的在生成的大图的坐标和大小。下面将使用介绍算法那种思路把UIAtlasMakder的工作流程描述清楚。
在详细介绍之前，UIAtlasMakder定义了UISpriteEntry这个类：
C#代码class SpriteEntry : UISpriteData { // Sprite texture -- original texture or a temporary texture public Texture2D tex; // Whether the texture is temporary and should be deleted public bool temporaryTexture = false; } 只是在UISpriteData基础上扩展了一个Texture2D tex的成员变量，那么这个类到底做什么用呢？通过分析代码可以知道：UISpriteEntry是UISpriteData和Texture2D的中间体，是Texture2D和UISpriteData转化的载体，就提过程下面会有引人。
UIAtlasMaker的工作流程：
1）选择图片or图集，函数：void OnSelectAtlas (Object obj) 和 List<Texture> GetSelectedTextures ()
2）导入选择图片的Texture2D，函数：static List<Texture2D> LoadTextures (List<Texture> textures)
3）将Texture2D转出UISpriteEntry，函数：static List<SpriteEntry> CreateSprites (List<Texture> textures) ，这个函数中包括了2）的步骤
3）打包成大图片并生成UISpriteData，函数：static bool PackTextures (Texture2D tex, List<SpriteEntry> sprites)，这个函数提供两种打包方式：1.NGUI自己实现类UITextPacker，2.Unity3D提供的api
4）释放UISpriteEntry，函数：static void ReleaseSprites (List<SpriteEntry> sprites)，主要是通过NGUITools.Destroy销毁纹理，最后调用Resources.UnloadUnusedAssets();，这个趁机告诉我们Unity中资源销毁的方法，一个不能少哈。
C#代码static void ReleaseSprites (List<SpriteEntry> sprites) { foreach (SpriteEntry se in sprites) { if (se.temporaryTexture) { NGUITools.Destroy(se.tex); se.tex = null; } } Resources.UnloadUnusedAssets(); }
差不多就是这样子，其他就是一些功能操作：add，replace,delete,udpate,extract。
这样看来，把UIAtlas分析清楚，掌握UIAtlasMaker的原理应该不难，当然里面有很多细节，使用很多api：AssetDatabase,Texture,SelectedObject以及NGUI自己封装的一些函数。
小结：
UIAtlas虽然在使用NGUI过程中用的太多了，但是经过上面的分析，其实不是很难，个人觉得还没有UIRoot（NGUI所见即所得之UIRoot）的难以驾驭，即使UIRoot很短很单一。这里说下D.S.Qiu的关于快速学习的一点体会：古人有云，“工欲善其事，必先利其器”，NGUI最为一个工具，要使用好它，就要充分掌握它， 换句话说就要懂它，当然还可以从中偷到很多师——功能的具体实现和代码逻辑的设计，其实一直觉得我对细节都不求甚解，会用就可以走路了，又不用自己写一个NGUI，当然细节都能掌握就更完美了。已经到凌晨一点了，先写这么多，有补充在加。
如果您对D.S.Qiu有任何建议或意见可以在文章后面评论，或者发邮件（gd.s.qiu@Gmail.com)交流，您的鼓励和支持是我前进的动力，希望能有更多更好的分享。
转载请在文首注明出处：http://dsqiu.iteye.com/blog/1967088
更多精彩请关注D.S.Qiu的博客和微博（ID：静水逐风）
新闻热点
疑难解答
