NGUI的ScrollView以及Grid的使用

最近几天用到了NGUI的ScrollView以及Grid来实现上滑下滑的功能，

编辑时结构图如下:

界面如下:

游戏运行时的时结构图如下:

界面如下:

在ScrollView下面放置一个子物体Grid是因为Grid有自动排序功能，使每一个技能item能够整齐排列。

ScrollView默认是水平滑动的，记得在inspector面板选择垂直滑动。

要使得ScrollBar能够控制ScrollView,记得指定ScrollView的ScrollBar面板：

Grid的属性记得要设置一下：

cell width和cell height设置成和scrollview每一个item的大小相似，如果希望

item间有间隔，可以将height设置高点。然后Arrangement表示你所需要的排列方式，

一般和ScrollView的movement保持一致即可。

然后是代码：

foreach (int id in idList)//idList里面放置每个物品信息的id号
        {
            GameObject itemGo = NGUITools.AddChild(grid.gameObject, skillItemPrefab);//这句话相当于你手动拖拽<skillItemPrefab到Grid物体下面,可以看上面编辑和运行时的结构图

            grid.AddChild(itemGo.transform);//这句话很重要，是实现Grid控件管理子物体transform功能的语句
            itemGo.GetComponent<SkillItem>().SetId(id);//实例化子物体
        }

下面来看注释

  grid.AddChild(itemGo.transform);

这句话的效果：

与上图的游戏效果有明显差别

下面提供NGUI免费详细视频教程，感谢siki老师作出的贡献：点击打开链接

如果在ScrollView中不使用，滑动条，而是直接按住内容上下滑动，

层级结构如下：

我们不用再ScrollView以及Grid上面

做手脚，设置了Grid的一些排列属性后

直接在要滑动的子元素(图中蓝色字显示)

中添加UI Drag Scroll View脚本，然后ScrollView指定图的ScrollView即可。