【转载】NGUI官网示例11 –Drag & Drop（一）

艾西格亚

（浙江传媒学院-新媒体学院-数字游戏设计专业-张sir）



游戏中经常会用到储物箱等GUI，GUI的一边是物品的图标，另一边是一个角色，你可以拖动这些图标放置到角色上，为它装配装备。那么我们首先来实现较为简单的Drag&Drop功能。如图所示：







首先来制作三维的场景：

1. 使用Create a new UI对话框创建一个Advanced3D UI，如图所示：







把Panel拖出来，脱离Anchor父物体，然后改名为3D，接着把Camera作为子物体拖动到Panel下面，reset一下Camera对象，最后删除UI Root（3D）对象和Anchor对象，这里删除UIRoot是因为这个对象只是用于调整GUI大小的，而我们这个层级只要显示一个立方体和一个背景而已，如图所示







选择Camera，使用WidgetTool对话框在Camera下创建一个SlicedSprite对象，调整其大小和位置，作为其背景，如图所示







创建一个空的游戏对象，并命名为stage，该对象用来使得其子物体能够自动旋转，把该游戏对象放置到3D对象下，成为其子物体，并reset一下，如图所示







在stage下创建一个Cube，并为该Cube赋予一个brick材质，在project窗中，打开NGUI-> Example->brick。并调整它的大小，如图所示







选择stage对象，调整它的位置，如图所示







再次选择stage对象，为它添加一个spin组件（Component->NUI->Example->spin），这个组件可以旋转自身，并设置其参数，点击播放，可以看到立方体旋转起来了。当然这里大家应该知道，子物体会继承父物体的所有变换（平移、缩放和旋转）。如图所示







选择cube对象，为其添加一个SpinWithMouse组件（Component->NGUI->Example->Spin With Mouse）,该组件可以使得物体随着鼠标的拖动而转动，如图所示







在3D对象下创建一个Direction Light，这样就把场景照亮了，这样场景就漂亮多了，如图所示







接下来，我们来制作GUI部分。使用Create a new UI对话框，创建一个Simple 2D，如图所示







把Anchor对象改名为Anchor Bottom，并设置其side参数为Bottom。如图所示







选择Panel，改名为Window Panel，使用WidgetTool创建一个SlicedSprite，设置参数，并把该元件改名为background，并调整它的大小和位置，如图所示







现在看到视口中间还有一个正方形，这个东西是我们上面那个3D对象层级的背景，我们选择UIRoot（2D）对象包括其子对象，为其添加一个2DGUI layer（如何添加Layer和Layer的作用在unity文档中有描述，这里不再赘述）。选择UIRoot（2D）中的Camera，设置其Culling Mask为2DGUI，也就是说这个摄像机只显示这个Layer中的对象，其他Layer的对象不会在这个摄像机中显示。最后效果如图所示







选择WindowPanel，为其添加一个新的Panel（NGUI->create a Panel），并重新命名为ListPanel，如图所示







为ListPanel创建一个空的游戏对象，并命名为DragDropContainer，reset一下，并为它添加一个Collider（NGUI->Attach a collider），如图所示

艾西格亚

这个教程还有第二部分，请期待

最爱小布点

跪求NGUI官网示例11 –Drag & Drop（二） 第二部分内容

其实我是神

www.narkii.com这里好东西很多。

may

支持楼主的帖子

王者再临

学习了，虽然还是有难度，谢谢楼主的用心  

xueshong

今天整了哈  拖动旋转老是不成功