例8 – Scroll View(Camera)
在上一个示例中的 ScrollView 使用到了 Shader 的处理，而对于一些低端的机器或者移动设备可能会出现显示不正常的结果，所以， NGUI 还为我们准备了另外一个处理方式，也就是通过摄像机的移动来达到同样的目的。接下来，这个示例就是告诉大家如何实现这个功能。
首先先制作一个普通的 GUI 界面，这些界面在上面的教程中已经说过，这里就不再赘述，其最终效果如图所示：
现在来制作那些可以滚动的Item结构。使用Create a new UI创建一个NGUI基本结构，并调整它们的层次关系，并把UIRoot下的Panel组件删除掉，最终如图所示：
新建一个新的空游戏对象，并命名为Offset，并放置在anchor成为它的子物体，并reset一下，同时给它添加一个Panel组件（Component->NGUI->Interation-> Panel）,这样，该对象才能放置NGUI元件。如图所示:
同NGUI官网示例7-- ScrollView讲解(一) （http://game.ceeger.com/forum/read.php?tid=4269）
一样，创建1个Item元件，然后用Ctrl+D的方法复制出9个来，当然你也可以复制你需要的数量，现在这些Item都是重叠在一起的，最终效果如图所示：
选择Offset，为其添加一个Table组件（Component->NGUI->Interaction -> Table）。哈，神奇的效果在此出现，只是上一个教程使用Grid组件，这次使用的是Table，这个Table和Grid的不同，可以查下官网的说明。这里不赘述。如图所示：
选择第一次创建的GUI结构，选择Window下的TiledSprite，如图所示：
在下面创建两个空的游戏对象，并分别命名为BottomRight和TopLeft，这两个空对象用来标记滚动Item的边界，并在场景编辑窗口中放置在对应的位置，最后为该TiledSprite添加一个UIDragCamera组件（Component->NGUI->Interation -> DragCamera）如图所示:
选择第二个Camera，为其添加一个ViewCamera组件（Component->NGUI->UI-> ViewCamera）,并把第一个摄像机赋值给SourceCamera，把TopLeft对象赋值给Top Left，把BottomRight赋值给Bottom Right，然后选择Offset，调整该对象的位置，如图所示：
为该摄像机添加一个DraggableCamera组件（Component->NGUI->Interaction-> DraggableCamera）,并为其设置参数，如图所示
再次选择刚才添加了两个空对象的择Window下的TiledSprite，把第二个Camera赋值给该元件中的DragCamera组件中的DraggableCamera，其结果如下
接着同样选择该TiledSprite，为其添加一个Collider，这样，才能接受输入信息（NGUI-> Attach a Collider）。哈哈。真好Happy，看结果，结果一个点击播放，成这样了？！虽然能够接受到输入信息，但是，死活拖不动
原来，在第二个GUI结构中的Anchor对象中，原来默认组件UIAnchor中的参数UICamera是第二个摄像机，我们现在把它改成第一个摄像机，再点击播放，Well Done！成功了！
接着给每个Item添加一个DragCamera组件（Component->NGUI-> Interaction -> DragCamera）和一个Trigger（Ngui->Attach a Collider）。再为其添加一个ButtonScale组件和一个buttonSound组件（都在Component->NGUI->Interaction中）
最后来实现那个Press me按钮。首先，选择Window对象，为其添加一个TweenPosisiton组件（Component->Tween->Position），并关闭它（我们将用按钮来开启它），并设置它的参数，如图所示
在上一个示例中的 ScrollView 使用到了 Shader 的处理，而对于一些低端的机器或者移动设备可能会出现显示不正常的结果，所以， NGUI 还为我们准备了另外一个处理方式，也就是通过摄像机的移动来达到同样的目的。接下来，这个示例就是告诉大家如何实现这个功能。
首先先制作一个普通的 GUI 界面，这些界面在上面的教程中已经说过，这里就不再赘述，其最终效果如图所示：
现在来制作那些可以滚动的Item结构。使用Create a new UI创建一个NGUI基本结构，并调整它们的层次关系，并把UIRoot下的Panel组件删除掉，最终如图所示：
新建一个新的空游戏对象，并命名为Offset，并放置在anchor成为它的子物体，并reset一下，同时给它添加一个Panel组件（Component->NGUI->Interation-> Panel）,这样，该对象才能放置NGUI元件。如图所示:
同NGUI官网示例7-- ScrollView讲解(一) （http://game.ceeger.com/forum/read.php?tid=4269）
一样，创建1个Item元件，然后用Ctrl+D的方法复制出9个来，当然你也可以复制你需要的数量，现在这些Item都是重叠在一起的，最终效果如图所示：
选择Offset，为其添加一个Table组件（Component->NGUI->Interaction -> Table）。哈，神奇的效果在此出现，只是上一个教程使用Grid组件，这次使用的是Table，这个Table和Grid的不同，可以查下官网的说明。这里不赘述。如图所示：
选择第一次创建的GUI结构，选择Window下的TiledSprite，如图所示：
在下面创建两个空的游戏对象，并分别命名为BottomRight和TopLeft，这两个空对象用来标记滚动Item的边界，并在场景编辑窗口中放置在对应的位置，最后为该TiledSprite添加一个UIDragCamera组件（Component->NGUI->Interation -> DragCamera）如图所示:
选择第二个Camera，为其添加一个ViewCamera组件（Component->NGUI->UI-> ViewCamera）,并把第一个摄像机赋值给SourceCamera，把TopLeft对象赋值给Top Left，把BottomRight赋值给Bottom Right，然后选择Offset，调整该对象的位置，如图所示：
为该摄像机添加一个DraggableCamera组件（Component->NGUI->Interaction-> DraggableCamera）,并为其设置参数，如图所示
再次选择刚才添加了两个空对象的择Window下的TiledSprite，把第二个Camera赋值给该元件中的DragCamera组件中的DraggableCamera，其结果如下
接着同样选择该TiledSprite，为其添加一个Collider，这样，才能接受输入信息（NGUI-> Attach a Collider）。哈哈。真好Happy，看结果，结果一个点击播放，成这样了？！虽然能够接受到输入信息，但是，死活拖不动
原来，在第二个GUI结构中的Anchor对象中，原来默认组件UIAnchor中的参数UICamera是第二个摄像机，我们现在把它改成第一个摄像机，再点击播放，Well Done！成功了！
接着给每个Item添加一个DragCamera组件（Component->NGUI-> Interaction -> DragCamera）和一个Trigger（Ngui->Attach a Collider）。再为其添加一个ButtonScale组件和一个buttonSound组件（都在Component->NGUI->Interaction中）
最后来实现那个Press me按钮。首先，选择Window对象，为其添加一个TweenPosisiton组件（Component->Tween->Position），并关闭它（我们将用按钮来开启它），并设置它的参数，如图所示
1897
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
