制作第一个UI图集

Posted 2020-08-06 _Soy

　　按钮分有两种形式，一种是普通按钮，也就是一张没有文字的按钮图片，在需要用时，就在上面写上不同的、当前所需要的文字。量一种按钮则是图片按钮，这种按钮的特点是整个按钮就是一张图片，它既是按钮也是图片。

 

在剖析UI资源结构时一定要秉承一下几个原则：

　　1.尽量保证还原设计图的效果，不损失质量，这是前提。

　　2.尽量发现重复的元件，而且重复的元件只需要一份就足够。

　　3.尽量分割得零碎一点，避免多个元件合并一起出图，这样对项目不利。

　　4.尽量使用九宫格来制作比较大的底板、底框等。

　　5.UI切图全部让美术人员以PNG格式导出。

 

如何导入切好的美术资源

　　在Unity的Project窗口下的Assets文件夹下面建立一个文件夹，将该文件夹命名为Resources，表示这个项目的资源都放在这个文件夹下面，UI资源也不例外。这个文件夹名字一定要设定为Resources，不能改动。

　　Unity开发中，如果设计动态加载(在游戏中触发了某个条件才需要加载)的情况，都会用到Unity的资源加载方法：Resources.Load()；这要求需要被动加载的资源一定要放在Assets下面一个叫Resources的文件夹中。

　　因为Unity在生成游戏安装包时，对于Resources以外的文件夹，只会打包场景中用到的资源文件，而对于Resources文件夹，因为涉及动态地往内存里加载资源，所以Unity会无条件的全部打包。

 

用Atlas Maker制作图集

　　在Unity的Project窗口中选中UI元件，单击鼠标右键，选择最顶部NGUI菜单，选择Open Atlas Maker(Atlas Maker是NGUI自带的一个UI图片打包工具)，这样就能自动将这些UI元件放入到Altas Maker中。或者在Unity顶部的菜单栏中，选择NGUI菜单，然后选择Open->Atlas Maker即可。

　　

 　　标号为1的红框是已有图集的选择按钮，如果需要将新导入的UI素材资源全部新增到一个已有的图集里，就可以单击这里。单击后能看到当前项目工程中已有的所有的图集，然后可以选择其中一个图集，此时标号为2的红框处的按钮将变成Add/Update，这样就可以新增或者更新这批资源到已有的选定的图集中了。

　　标号为2的红框是主按钮，当要打包的UI素材资源没有选定打包到某个已有图集中去时，这个主按钮会显示Create，意为用这些资源创建一个全新的图集。如果通过标号1的红框处的按钮选择了一个已有图集的话，这个主按钮将变成Add/Update，意为新增/更新当前这批UI资源到选中的图集中。更新的机制为同名的Sprite图片将会被替换。

　　图中标号3处的红框显示的是当前选中的UI图片资源的序号和文件名称，标号4处的红框显示的是这些资源哪些是新增的；哪些是更新的；哪些是已有的。在这里，如果选中了一个已有图集，那么该图集中的Sprite也会一起显示出来。

　　如果需要更新现有图集中的某一个精灵，则将新的精灵图片文件的名字设为和它要替换的精灵的名字一样，然后按照以上步骤选择它要替换的精灵所在的图集，单击Add/Update即可实现直接替换资源。

　　当需要创建一个全新的图集时，单击Create主按钮，会弹出Save As对话框，将路径定位到Resources目录下，然后将图集的名称改为"MyFirstAtlas"，单击"保存"按钮即可。文件保存后是一个Prefab。

　　单击"保存"按钮之后，中间的主按钮变成了View Sprites，单击后可以预览该图集中所拥有的精灵。

　　关闭Atlas Maker界面，然后注意看Project窗口中，Resources目录下除了之前导入的UI图片资源以外，多出了3个名为"MyFirstAtlas"的文件。这3个文件是一个图集必须具备的3个文件：图集的贴图、图集的材质球和图集的预设体。其中，球形图标文件为图集的材质球；蓝色方块的文件为图集的预设体；图片缩略图文件则是图集的贴图，也就是精灵合成为一张整图之后的图片。

　　特别注明：在制作完UI图集之后，可以将之前导入Unity的UI资源源文件删除以减小资源量。