UIScrollView组件下拉加载刷新功能
发表于2018-12-05
相信很多人都玩过微博，经常会去刷新微博看新内容，那么这个功能是如何实现出来的呢，下面就要请出今天的主角UIScrollView组件，借助UIScrollView组件实现下拉加载刷新内容的功能。
注意：在实现该功能的时候需要了解如何使用Scrollbar和ScrollRect组件。
一、组件部分
1、创建一个Canvas，在Canvas下添加Panel。
2、在Panel上添加ScroRect组件
3、在Panel下添加一个空物体改名为Grid添加GirdLayoutGroup与ContentSizeFitter组件并进行相应合适的设置。
4、在Canvas下添加Scroll bar，根据自己的需求去设置，这个控件就是用来判断列表是否到最底部。
5、回来设置ScroRect组件，将Grid与ScrollBar拖到相应的地方。
6、制作单条列表的预制件，在这里简单制作，所以我就创建了一张图片并添加了Text组件显示信息区别每一条列表信息
二、预制件的代码
在预制件上我添加了ItemControl脚本用来简单的控制单条信息的显示，代码如下：
public class ItemControl : MonoBehaviour ｛
private Text tNum;
public void ShowItemText(string str) ｛
tNum = this.transform.GetComponentInChildren<text>();
tNum.text = str;
｝
｝</text>
非常简单，获取到子物体上的Text组件并且进行赋值。
三、主要控制代码
接下来就是主要的代码了，我在Panel上添加了一个test脚本，继承MonoBehaviour，与IEndDragHandler接口，并且实现IEndDragHandler接口中的OnEndDrag()方法，当我们滑动列表结束的时候将会调用OnEndDrag()方法，注意在这里不是滑动到列表的最下面时调用，而是我们每一次滑动结束时这个方法就会被触发。
1、首先绑定我们需要的scrollbar，GridLayoutGroup还有我们的预制件。
public Scrollbar bar;//获得Scrollbar组件
public GridLayoutGroup vGroup;//获得GridLayoutGroup组件
public ItemControl item;//添加预制件
2、在Start方法中 初始化数据与列表的状态。
private void Start()
｛
AddItem();//添加数据
//将列表移动到第一条数据
bar.value = 1;
｝
在这里 bar.value=1 是因为我出现了每次加载后都是从中间的数据显示，列表移动了中间位置，并不是从第一条数据显示，估计是我哪个地方没有设置好，设置了半天又没有找到，所有直接通过滚动条的value值，把数据移动到了第一条。
3、接下来就是添加数据，每一次添加5条数据。
void AddItem() ｛
for (int i = 0; i < 5; i++)
｛
GameObject newItem = AddItemGameobject(item.gameObject, vGroup.gameObject);
string str = "现在是第:" + indexItem + "项," + "第：" + index + "条";
newItem.GetComponent<ItemControl>().ShowItemText(str);
｝
｝
public GameObject AddItemGameobject(GameObject o, GameObject parent)
｛
index++;//创建的第几条数据
GameObject go = GameObject.Instantiate(o) as GameObject;
go.transform.SetParent(parent.transform);//设置父物体，将数据添加到 Grid物体下面，并且设置位置，大小。
go.transform.localPosition = Vector3.zero;
go.transform.localScale = Vector3.one;
return go;
｝
4、接下来就要实现刷新了，开始我们实现了OnEndDrag()方法，用来检测滑动结束，所有我们的刷新就在放在这里，然后我们通过bar.value的值来判断有没有到最后一条数据，bar.value值永远都是从0~1进行改变，之前我们也选择的是从下到上，所以0就代表了最下面 ， 1 代表顶层。
代码如下：
public void OnEndDrag(PointerEventData eventData)
｛
if (bar.value == 0) ｛//判断当最下面的时候就进行加载，同理我们做上拉刷新时，只要判断value是否等于1
indexItem++;//第几次创建
AddItem(); //加载数据
｝
｝
同理当我们用到上拉刷新的时候也可以使用这个方法。
整体代码：
using UnityEngine;
using System.Collections;
using UnityEngine.UI;
using UnityEngine.EventSystems;
public class test : MonoBehaviour, IEndDragHandler
｛
public Scrollbar bar;//获得Scrollbar组件
public GridLayoutGroup vGroup;//获得GridLayoutGroup组件
public ItemControl item;//添加预制件
private int index = 0;
private int indexItem = 1;
private void Start()
｛
AddItem();//添加数据
//将列表移动到第一条数据
bar.value = 1;
｝
public void OnEndDrag(PointerEventData eventData)
｛
if (bar.value == 0) ｛//判断当最下面的时候就进行加载，同理我们做上拉刷新时，只要判断value是否等于1
indexItem++;//第几次创建
AddItem(); //加载数据
｝
｝
void AddItem() ｛
for (int i = 0; i < 5; i++)
｛
GameObject newItem = AddItemGameobject(item.gameObject, vGroup.gameObject);
string str = "现在是第:" + indexItem + "项," + "第：" + index + "条";
newItem.GetComponent<ItemControl>().ShowItemText(str);
｝
｝
public GameObject AddItemGameobject(GameObject o, GameObject parent)
｛
index++;//创建的第几个物体
GameObject go = GameObject.Instantiate(o) as GameObject;
go.transform.SetParent(parent.transform);//设置服务体，将数据添加到 Grid物体下面
go.transform.localPosition = Vector3.zero;
go.transform.localScale = Vector3.one;
return go;
｝
｝
四、运行
因为我这里隐藏了ScrollBar组件上的所有图片 所有这里ScrollBar不会显示出来
五、总结
以上就是使用UIScrollView组件实现下拉加载刷新内容，非常简单，可以在这基础上添加 异步读取数据，添加加载时的提示等等。