unity NGUI 中ScrollView大量物体的优化方式：重用item

不管是游戏还是软件，列表(ScrollView)都是算是最常用的控件之一。列表中的内容少的几个，而多的时候几千上万个，这时候如果我们不对列表进行优化，直接加载所有物体肯定是不现实的。当然这个问题的优化策略网上也不少，最多的就是重用item，大概看了一些，不是做的非常复杂就是说的含糊不清，所以这里自己动手写了个demo，简单易懂，代码量很少，一共100多行代码，这里分享出来。

基本思想就是当列表向上移动时，我们就把超出屏幕上部的item移动到列表末尾位置并重置数据。当列表向下移动时，就把超出屏幕下部的item移动到列表开头。

首先创建Scroll View ，Grid并把他们设置为竖向的，调整好尺寸。

在创Grid下建一个我们想要的item，不要忘记添加BosCollider和UIDragScrollView，BosCollider要勾选IsTrigger。并制作成预制体。

制作完后运行场景，一切顺利的话我们可以看到一个item，并且可以在ScrollView范围内拖拽.

现在开始编写脚本:

创建一个数据类ScrollViewItemData:

public class ScrollViewItemData {
	public int index;
	public string name;
	public ScrollViewItemData(int index,string name){
		this.index = index;
		this.name = name;
	}
}

这个类应该是列表中每个item的原始数据。这里我们只简单的定一个2个数据，一个索引，一个name。

索引用来记录当前数据的顺序，name用来作为需要显示的内容。

然后创建item的脚本ScrollViewItem:

public class ScrollViewItem : MonoBehaviour {
	UILabel label;
	public ScrollViewItemData data;
	// Use this for initialization
	void Awake () {
		label = transform.Find("Label").GetComponent<UILabel> ();

	}

	public void SetData(ScrollViewItemData data){
		this.data = data;
		label.text = data.name ;
	}

	// Update is called once per frame
	void Update () {
		
	}
}

这里我们声明了一个ScrollViewItemData类的引用，用来记录当前item显示的是哪一条数据。我在预制体中增加的一个UILabel用来显示当前数据的name。我们需要把这个脚本放到之前创建的item的预制体上。

接下来是核心的列表控制器ScrollViewManager,先上完整代码:

public class ScrollViewManager : MonoBehaviour {
	List<ScrollViewItem> itemList = new List<ScrollViewItem>();
	List<ScrollViewItemData> itemDataList = new List<ScrollViewItemData> ();

	UIScrollView sv;
	UIGrid grid;

    //记录scrollviet上一次的位置，用于判断scrollview的移动方向
	float svLastPos = 0;

	//最大y坐标
	float maxHeight = 0;

	//最小y坐标
	float minHeight = 0;

	// Use this for initialization
	void Start () {
		//初始化测试数据

		for (int i = 0; i < 20; i++) {
			itemDataList.Add (new ScrollViewItemData (i,"第" + i + "个元素"));
		}


		sv = transform.GetComponent<UIScrollView> ();
		grid = transform.Find ("Grid").GetComponent<UIGrid>();

		Vector2 viewsize = transform.GetComponent<UIPanel> ().GetViewSize ();
		int count = (int)(viewsize.y / grid.cellHeight + 2);
		Debug.Log (count);
		for (int i = 0; i < count ; i++) {
			if (itemDataList.Count <= i)
				break;
			
			GameObject o = Resources.Load("Prefabs/ScrollViewItem") as GameObject;
			GameObject obj = NGUITools.AddChild(grid.gameObject, o);

			ScrollViewItem item = obj.GetComponent<ScrollViewItem>();
			itemList.Add (item);

			item.SetData (itemDataList[i]);
		}
		grid.repositionNow = true;
		grid.Reposition();

		svLastPos = grid.transform.localPosition.y;

		maxHeight = viewsize.y / 2 + grid.cellHeight / 2;

		minHeight = -maxHeight;

	}

	// Update is called once per frame
	void Update () {
        float moveDis = sv.transform.localPosition.y - svLastPos;
        if (Mathf.Abs(moveDis) > 0.05) {
            bool isup = moveDis > 0;
			if (isup) {
				while (itemList [0].transform.localPosition.y + sv.transform.localPosition.y > maxHeight &&
				       itemList [itemList.Count - 1].data.index < itemDataList.Count - 1) {
					ScrollViewItem item = itemList [0];
					item.SetData (itemDataList [itemList [itemList.Count - 1].data.index + 1]);

					itemList.Add (item);
					itemList.RemoveAt (0);

					item.transform.localPosition = itemList[itemList.Count - 2].transform.localPosition - 
						new Vector3 (0,grid.cellHeight,0);
				}
			} else {
				while (itemList [itemList.Count - 1].transform.localPosition.y + sv.transform.localPosition.y   < minHeight &&
					itemList [0].data.index > 0) {
					ScrollViewItem item = itemList [itemList.Count - 1];
					item.SetData (itemDataList [itemList [0].data.index - 1]);

					itemList.Insert (0, item);
					itemList.RemoveAt (itemList.Count - 1);

					item.transform.localPosition = itemList[1].transform.localPosition + 
						new Vector3 (0,grid.cellHeight,0);
				}
			}

			svLastPos = sv.transform.localPosition.y;
		}

	}
}

首先我们定义了两个列表用来保存所有的item物体以及列表中的全部数据.

由于没有在UIScrollView的API中找到获取当前移动方向的接口，所以这里只能定义一个变量svLastPos自己记录一下位置，进行判断。

然后定义了2个变量用于判断item移出屏幕的最大和最小距离。

先看Start函数

1.先初始化了20个测试数据。

2.然后计算需要生成多少个item对象，这里我们用整个ScrollView的高度除以每个item的高度得到屏幕中一共能显示多少个item，然后加上2个以避免item不足的情况出现。

3.然后创建item并初始化数据。

4.最后计算屏幕的最大高度和最小高度。

然后是Update方法：

1.判断列表是否移动，用现在的位置-之前记录的位置的绝对值进行判断，如果移动了，开始我们重置item的逻辑。

2.判断移动方向，如果向上则判断item列表中第0个元素是否超出坐标范围，如果向下移动则判断最后一个元素。

这里为了避免移动过快出现bug，我们使用while将所有超出范围的item一起进行处理。

还要判断数据列表中是否超出范围如果超出范围说明没有数据，不需要继续重置item的位置了。

4.如果需要移动item，首先将item中的数据设置为目标数据，这里直接取item列表最后一个元素获取到数据的index并且+1就是目标数据，然后将当前item添加到列表末尾同时删除列表第一个元素，最后设置item的坐标。向上移动和向下移动的逻辑正好相反，这里不再复述。

来看下最后的效果：