NGUI官网示例2-interaction-讲解(二)
zf223669
zf223669 14290 23
精华热门加亮 NGUI 2012-09-29 11:52
1.         以上几步就实现了官网上的Interaction中窗口位置的平滑变换效果。关键是UIButtonTween和其他的Tween类型之间的连接。最后,把摄像机调整到其他的角度,(没有怎么去考虑美术上面的东西,有点难看,呵呵)如图所示:

描述:请输入描述

图片:21.png

请输入描述

现在,来制作NUI按钮与场景中的对象的交互。首先,在场景中创建一个立方体,并为它赋予brick材质(在Project窗口中,NGUI->Example->Materials->brick,为该立方体添加一个Spin组件(Component->Examples->Spin,该脚本可以实现物体的旋转。再为其添加一个UIButtonScale组件(Component->Interaction->ButtonScale),该组件可以实现当鼠标位于该物体上面时,对该物体进行缩放。最后为其添加一个TweenPosition组件(Component->Tween->position,设置其MethodEaseInOutDuration0.5From为起始位置,To为最终位置,这两个位置根据你需要制作的位置不同而不同,你可以通过在编辑器中拖动该物体,然后确定该位置,并记录下来,输入到FromTo中。最终效果如下,

描述:请输入描述

图片:22.png

请输入描述

复制出另外一个立方体,并重新设置其他的FromTo值。创建一个名称为Cubes的空对象,并把这两个Cube作为它的子物体。并把Cubes放置到3D UI对象下,这步虽然没什么作用,不过可以方便管理,让Hierarchy好看点。最后把Cubesenable关掉,如图所示:

描述:请输入描述

图片:23.png

请输入描述

接着,来完成当点击show按钮时,立方体出现,并平滑平移到设置的位置。选择show按钮,为其添加一个UIButtonTween,方法与第19步相同,接着,把Cubes赋值给Tween TargetTriggerOnClickPlayDirectionForwardIf Disable On PlayEnableThenPlay。再同样设置Hide按钮,过程与第20步相同,只是把TweenTarget改成Cubes而已,并把Disable When Finished设置成DisableAfterReverse,呵呵,一看就知道什么意思,就是当播放完成之后,把TweenTarget中的对象关掉,并把IncludeChildren勾选上,不然只会作用到父物体上,而子物体的动画就播不了了。
这样,就差不多大功告成了。现在,为摄像机添加一个鼠标摆动动画,选择摄像机之后,给它添加一个PanWithMouseComponent->NGUI->Example->Pan with Camera)。添加完之后,点击播放试试,摄像机就活起来了。
最后再为该场景添加一个平行光,不然那两个立方体看起来就太无趣了。最终效果如下:

描述:请输入描述

图片:24.png

请输入描述

 
还有最后一个东西,就是窗口左边的小图标,使用Create a new Widget工具创建一个Sprite,并把它放置到窗口的左上角,调整位置和角度,最后效果如下:

描述:请输入描述

图片:25.png

请输入描述

ok。大功告成,天哪。论坛里面发图片真的很麻烦。。。格式可能有点乱了。请见谅。
(浙江传媒学院-新媒体学院-数字游戏设计专业-张sir)
分享:
游客
要评论请先登录 或者 注册
23条回应 只看楼主 最新
翾辰 学徒 2012-09-29 12:12 1楼
前排火速支持! 希望持续更新~好兄弟!
zh6845835 学徒 2012-09-29 12:30 2楼
迅速抢占沙发,期待继续更新,加油~
liwei1dao 学徒 2012-09-29 16:06 3楼
路过,
莱汀 学徒 2012-09-29 17:09 4楼
写的太详细了,辛苦了
人参攻g 学徒 2012-10-08 16:04 5楼
好东西要顶
wangyel1 大师 2012-10-23 21:07 6楼
非常详细,谢谢整理分享
延澈左 学徒 2012-10-28 21:26 7楼
写的不太对吧???有的步骤有问题吧??!!对初学者来说,不详细会造成很大的麻烦。
yustarg 学徒 2012-10-29 21:12 8楼
非常详细,太棒了!!一定要支持啊
licky 学徒 2012-10-30 14:16 9楼
这个也学会了,tks
1 2 3
返回顶部