首页 > Unity3D频道 > 【NGUI研究院之Unity插件】 > NGUI研究院之Sprite精灵与精灵动画的使用(二)
2012
05-21

NGUI研究院之Sprite精灵与精灵动画的使用(二)

         学习了几天Unity3D强大的NGUI插件,MOMO觉得NGUI中最大的亮点之一就是Sprite精灵。我们先说说精灵是什么东西?它可以在一张大图中去截取一部分(大图就是整体图像集合,而截取的小图就是一个精灵),然后起一个精灵的名称,使用时通过精灵的名称就能直接绘制,并且精灵还可以播放动画。总之真的非常强大。本节我们学习如何创建自己的精灵文件。

首先我们在Project中创建一个Prefab对象,默认给它Transform变换属性,暂时我们给Prefab对象起名为MySprite。接着给Prefab挂上图像集合组件。在Unity导航菜单栏中选择Component->NGUI->UI->Atlas(图像集合)即可。

常用的属性介绍:

Coordinates :UI坐标单位,用默认Pixels(像素)就行。

Pixel Size:像素的长度单位1。

Add/Delete:添加与删除精灵。

first就是当前精灵的名称,如果已添加了多个精灵都会出现在Sprite下拉列表中。再往下就是设置该精灵在大图的显示区域以及坐标,下图中我们可看到已经在整个大图中框选了一个区域,就是绿色的矩形,矩形中就是当前精灵中的内容。

 

NGUI研究院之Sprite精灵与精灵动画的使用(二) - 雨松MOMO程序研究院 - 1

 

         下面我们将这张图片分为4块完全相等的精灵,接着我们学习在代码中如何控制这些精灵的绘制以及排序。创建脚本Test.cs并且将它挂在刚刚创建的精灵对象身上。

Test.cs

 

如下图所示,精灵已经在代码中动态的修改完毕,并且设置了它的深度让它靠前显示。如果想修改它的X、Y位置,直接修改Transform即可。Z轴的话修改它的深度就行,不用修改Z轴坐标。

 

NGUI研究院之Sprite精灵与精灵动画的使用(二) - 雨松MOMO程序研究院 - 2

 

下面我们再来学习一下精灵动画,NGUI已经帮我们封装了专门播放精灵动画的类UISpriteAnimation 专门处理精灵动画。MOMO在网上随便找了一组2D主角的行走动画,按照上面介绍的方法将整个图片导入工程中。如下图所示,这组人物的行走动画我们选区取左移动的4帧。

这里我在强调一下,需要修改修改材质的着色器,让他支持背景透明,对当前材质的着色器我们选择Unlit/TransparentColored。

 

NGUI研究院之Sprite精灵与精灵动画的使用(二) - 雨松MOMO程序研究院 - 3

 

        接着在Hierarchy视图中选择Sprite(NGUI)(刚刚创建的精灵对象),然后在Unity导航菜单栏中选择Component->NGUI->UI->Sprite Animation(帧动画)组件即可。此时直接运行游戏我们就会发现主角已经按照刚刚裁剪的精灵顺序动了起来,这还没有完,我们下面学习在代码中如何动态的控制精灵。

        本例我们的目的是使用NGUI在屏幕中创建一个按钮,第一次点击按钮主角播放行走动画,再次点击按钮主角动画将停止。上篇文章中我们已经学习了NGUI中按钮的相应事件,如果想在别的对象或者脚本中监听某个按钮的点击事件那么就可以使用传递消息的方式。NGUI帮我们封装了一次传递消息的类,Unity导航菜单栏中选择NGUI-》Interaction->ButtonMessage。它的原理也是使用Unity的sendMessage,有兴趣的朋友可以去看看。接着说正题,创建脚本Test.cs挂在刚刚创建的按钮上。

Test.cs

 

如下图所示,运行游戏点击按钮。主角开始迈着大步开始行走了,再次点击主角将停止播放行走动画。嚯嚯。最后MOMO祝大家学习愉快啦啦啦!!

 

NGUI研究院之Sprite精灵与精灵动画的使用(二) - 雨松MOMO程序研究院 - 4

雨松MOMO提醒您:亲,如果您觉得本文不错,快快将这篇文章分享出去吧 。另外请点击网站顶部彩色广告或者捐赠支持本站发展,谢谢!

--

最后编辑:
作者:雨松MOMO
专注移动互联网,Unity3D游戏开发
捐 赠如果您愿意花10块钱请我喝一杯咖啡的话,请用手机扫描二维码即可通过支付宝直接向我捐款哦。

NGUI研究院之Sprite精灵与精灵动画的使用(二)》有 99 条评论

  1. 范锦昌 说:

    这么说只用ngui 就可以开发2d游戏了,unity自己的东西岂不是没用了?如果游戏无需物理引擎,精灵用ngui的精灵,是不是可以直接用ngui开发2d游戏,不用unity本身的东西。2d游戏和ui融为一体,岂不方便。

  2. 胡世春 说:

    求教NGUI的NGUIToos类在哪定义的!正在阅读NGUI源代码中……

  3. Tshine 说:

    过时了

  4. 小徐 说:

    不过多弄几下,再结合你的资料发现其实也没有那么难,温故而知新啊

  5. 小徐 说:

    雨凇momo 这一章貌似有点不详细啊 好多地方省略了吧? 木有看懂啊

  6. 乱舞春秋 说:

    我的Unity版本是4.2 NGUI是2.6.3 好多地方都看不明白啊

留下一个回复

你的email不会被公开。