Layabox引擎下fairygui虚拟列表的使用

当列表的item非常多是，创建多个item项无疑非常消耗时间和资源，这里就需要用到虚拟列表了，虚拟列表可以重复利用创建的item，事实上该列表创建Item的最大数量应该是列表最大可见的数量，这个数量通常由你创建列表的宽高，item的大小和你对列表的属性编辑决定。

虚拟列表开启的前提：

1.定义itemRenderer；

2.列表必须开启滚动，不开启滚动是不能设置为虚拟列表的；

3.fairyguiUI编辑器中必须为列表的项目资源设置默认项，通常是你需要的item资源。

 

解决好了这些问题我们就可以直观地用代码来使用这个列表了，这里代码是TypeScripts语言写的，假设列表为itemList

代码如下：

//将列表设置为虚拟列表

this.itemList.setVirtual();

//定义列表项，显示具体的列表信息

this.itemList.itemRenderer = Laya.Handler.create(this, this.itemRenderer, null, false);

//列表项的点击事件响应

this.itemList.on(fairygui.Events.CLICK_ITEM, this, this.onClickItem);

this.itemList.numItems = this.ListMaxNum;//列表中选项的最大数量，假设列表长度固定为ListChildNum

 

private itemRenderer(index:number, object:fairygui.GObject)

{

          //index为列表项目索引

           let item:fairygui.GComponent = <fairygui.GComponent> object;

}

 

private onClickItem(itemObject:fairygui.GObject):void

{

          let item:fairygui.GComponent = <fairygui.GComponent>itemObject;

          let childIndex = this.itemList.getChildIndex(itemObject);//显示索引，值得范围为0~this.ListChildNum

          let itemIndex = this.itemList.childIndexToItemIndex(childIndex);//项目索引，取值范围为0~this.ListMaxNum

}

虚拟列表的基本使用就是这样了，事实上它的列表项目资源是可变的，列表还有不上有意思的功能如有需要可以自己查看API和官方文档，官方文档链接为http://www.fairygui.com/guide/editor/list.html#%E8%99%9A%E6%8B%9F%E5%88%97%E8%A1%A8