Unity UI系统——NGUI

514 阅读3分钟

开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第31天,点击查看活动详情

NGUI的历史:

NGUI的最早版本发布于2011年12月份,NGUI可以说是Unity平台最强大的第三方UI系统Unity早期版本(Unity4.6之前),引擎自身的UI系统是很差的,绝大多数项目都是使用的NGUI进行UI界面开发的。

Unity新UI系统UGUI与NGUI效率的比较:

在贴图的批处理上,NGUI的做法比较死板,依然是根据让多个图片打成一个图集,然后通过不同的UV坐标来进行绘制图集上的精灵。因此,NGUI在极限情况下,能够做到整个UI只消耗一个DC。但同时这也带来了一个弊端,就是在UI动画的效率上,会很低。当界面有动画时,UIPanel的CPU占用率会急剧上升,并出现跳帧情况,让总体的帧率方差变大。而新UI系统则用了另外一种做法,去除图集的概念,并对相同图片进行合并,在极限情况下,画10个不同的图片,最少需要消耗10个DC。当两个相同的图片的深度之间,需要绘画其他UI并与这两个图片的任意一个有像素交叉时,这两个图片不进行合并,因此,对于动画的效率,要比NGUI高,跳帧情况少,帧率较为稳定。

另个较大的变化是,因为去除了图集,所以新UI就解决了NGUI中,图集出现大量黑色空白区域的问题,总体减少了内存占用。

资源打包上,因为新UI的图片资源全都是零散的单个图片,因此很难做到动态载入一个UI预设,因为需要关联的图片太多,步骤比较复杂。可能需要考虑所有UI资源常驻。经过计算测试,对于一般的手游来说,基本可以应付。若要进行较好的优化,则需要进行动态加载,需要把每一张图打成一个包,最后根据情况,动态加载图片。

总的来说,若游戏中,静态UI偏多(即没有多少UI动画)则用NGUI效率较高,若动态UI偏多(UI动画多且频繁),则UGUI效率要高出很多。

NGUI插件目录结构:

Editor: 编辑器扩展

Examples:示例工程

Resources :资源文件

Scripts:脚本组件

NGUI基本使用方法:

操作步骤:

NGUI -- Craete -- Label 创建一个用于显示文字的“游戏物体”,切换到Game面板,我们可以看到“New Label”字样。

NGUI层次结构:

UI Root(所有的NGUI元素都是请问这个字物体)

---Camera (用于渲染NGUI的摄像机)

---Label (Lable游戏物体)

---More UI (更多的游戏对象)

NGUI的操作细节:
  1. 在Scence视图“紫色”的矩形,就是我们NGUI的操作范围,其实也就是UIRoot的范围(鼠标选中UI Root,这个矩形区域会高亮显示)

  2. 我们可以点击Scene视图上方的“2D”按钮,切换到“2D”编辑模式

  3. 在2D的模式下,鼠标会选中UIRoot,紫色矩形也会高亮,现在将鼠标放到矩形上,点击鼠标右键,会出现NGUI的操作菜单,这个菜单我们以后会经常大量的使用,,

  4. 摄像机的图标会影响到我们得操作,可以将这个图标调小,点击Scene面板右上角Gizmos,3Dlcons 选项,调小即可,,,

Prefab Toolbar (功能菜单)

打开Prefab Toolbar,NGUI -- Open --Prefab Toolabar

Prefab Toolbar:

Prefab Toolbar:(NGUI)预制体工具栏,其实就是NGUI提供的一些现成的UI功能元素的预制体文件,我们可以直接鼠标单击选中,然后往Scene面板拖拽。