Unity系列——UGUI创建滑动列表tableview
UGUI创建滑动列表步骤
1、创建一个panel，命名moveLayer，添加mask组件进行遮罩裁剪，添加scrollRect进行滑动。
2、为moveLayer创建一个容器也是panel，为容器命名content，在容器content里面添加layout组件，并把content设置到scrollRect里面；添加小孩的长度和高度要动态改变容器的宽高，才可以进行滑动。
滑动原理：主要是通过有滑动事件的moveLayer层移动，然后在中间层content添加小孩。滑动的时候，content相对父类坐标也跟着变动；
UGUI中可以直接使用scrollview进行创建，它已经为我们刚刚的组件设置好了，为content里面添加layout组件，代码中根据添加小孩的长度和高度要动态改变容器的宽高或者添加content size fitter组件帮助自适应宽高。
如上述操作，我们在代码封装组件tableView，实现动态创建cell，减少消耗。并实现多行多列，自动适应宽高。主要思想是通过，监听scrollRect的滑动事件来进行操作。
直接上代码：
using UnityEngine;
using UnityEngine.UI;
using System;
using System.Collections;
using System.Collections.Generic;
///
/// @desc: 动态创建滑动列表，通过ugui5.3.6 通过创建Scroll View
/// @author: Rambo
/// @use 必须初始化scrollRect，content，itemPrefab,其他public参数按需初始；
/// @use 使用代码添加组件时，调用InitTableView进行初始化
/// @use 调用InitList创建tableView, setItemCall回调创建
///
[DisallowMultipleComponent]
public class TableView : MonoBehaviour
{
public enum Arrangement
{
Horizontal,
Vertical,
}
///
/// 选择滑动方向
///
public Arrangement arrangement = Arrangement.Vertical;
///
/// item刷新回调，声明了一个Delegate对象
///
public Action SetItemCall;
///
/// 设置行列，根据方向，垂直滑动为列，横向滑动为行
///
[Range(1, 50)]
public int maxPerLine = 1;
///
/// cells的宽间距
///
[Range(0, 50)]
public float cellWidthSpace = 0f;
///
/// cells的高间距
///
[Range(0, 50)]
public float cellHeightSpace = 0f;
///
/// 可见区域显示
///
[Range(0, 30)]
public int viewCount = 5;
public ScrollRect scrollRect;
public RectTransform content;
public GameObject itemPrefab;
private float cellWidth = 200f; //cells的宽
private float cellHeight = 200f; //cells的高
private int dataCount; //创建最大数量
private int curScrollPerLineIndex = -1; //当前滑动下标
private float offx; //位置偏移量x
private float offy; //位置偏移量y
private List listItem = new List(); //存储显示的cells
private Queue unUseItem = new Queue();//存储删除的cells
#region 初始化处理
///
/// 检测是否为空值
///
private bool CheckArgeIsNull()
{
if (content == null)
{
Debug.LogError("content null");
return true;
}
if (scrollRect == null)
{
Debug.LogError("scrollRect null");
return true;
}
if (itemPrefab == null)
{
Debug.LogError("itemPrefab null");
return true;
}
cellWidth = itemPrefab.GetComponent().sizeDelta.x;
cellHeight = itemPrefab.GetComponent().sizeDelta.y;
offx = -(content.sizeDelta.x - cellWidth) / 2 + 5;
offy = (content.sizeDelta.y - cellHeight) / 2 - 5;
return false;
}
///
/// 设置小孩数量
///
/// 小孩数量
private void SetDataCount(int count)
{
if (dataCount == count)
{
return;
}
dataCount = count;
//设置content描点,防止改变大小时移动
switch (arrangement)
{
case Arrangement.Horizontal:
//设置内容面板锚点，对齐方式，横向滑动为向左对齐
content.anchorMin = new Vector2(0f, 0.5f);
content.anchorMax = new Vector2(0f, 0.5f);
content.pivot = new Vector2(0f, 0.5f);
break;
case Arrangement.Vertical:
//设置内容面板锚点，对齐方式，纵向滑动为向上对齐
content.anchorMin = new Vector2(0.5f, 1f);
content.anchorMax = new Vector2(0.5f, 1f);
content.pivot = new Vector2(0.5f, 1f);
break;
}
}
///
/// 更新Content SizeDelta
///
private void SetUpdateContentSize()
{
int lineCount = Mathf.CeilToInt((float)dataCount / maxPerLine);
switch (arrangement)
{
case Arrangement.Horizontal:
content.sizeDelta = new Vector2(cellWidth * lineCount + cellWidthSpace * (lineCount - 1), content.sizeDelta.y);
//content.anchoredPosition = Vector2.zero;
break;
case Arrangement.Vertical:
content.sizeDelta = new Vector2(content.sizeDelta.x, cellHeight * lineCount + cellHeightSpace * (lineCount - 1));
//content.anchoredPosition = Vector2.zero;
break;
}
}
///
/// 延时设置ContentSize
///
///
/// 滑动改变监听
///
/// 滑动变化参数，0~1之间变化
private void OnValueChanged(Vector2 vt2)
{
switch (arrangement)
{
case Arrangement.Vertical:
float y = vt2.y;
if (y >= 1.0f || y <= 0.0f)
{
return;
}
break;
case Arrangement.Horizontal:
float x = vt2.x;
if (x <= 0.0f || x >= 1.0f)
{
return;
}
break;
}
int _curScrollPerLineIndex = GetCurScrollPerLineIndex();
if (_curScrollPerLineIndex == curScrollPerLineIndex)
{
return;
}
SetUpdateRectItem(_curScrollPerLineIndex);
}
///
/// 设置更新区域内item, 1.隐藏区域之外对象, 2.更新区域内数据
///
/// 当前滑动到的下标
private void SetUpdateRectItem(int scrollPerLineIndex)
{
if (scrollPerLineIndex < 0)
{
return;
}
curScrollPerLineIndex = scrollPerLineIndex;
int startDataIndex = curScrollPerLineIndex * maxPerLine;
int endDataIndex = (curScrollPerLineIndex + viewCount) * maxPerLine;
//移除
for (int i = listItem.Count - 1; i >= 0; i--)
{
TableViewItem item = listItem[i];
int index = item.Index;
if (index < startDataIndex || index >= endDataIndex)
{
item.Index = -1;
unUseItem.Enqueue(item);
listItem.Remove(item);
}
}
//显示
for (int dataIndex = startDataIndex; dataIndex < endDataIndex; dataIndex++)
{
if (dataIndex >= dataCount)
{
continue;
}
if (IsExistDataByDataIndex(dataIndex))
{
continue;
}
CreateItem(dataIndex);
}
}
///
/// 当前数据是否存在List中
///
/// 下标0开始
///
/// 根据Content偏移,计算当前开始显示所在数据列表中的行或列
///
///
/// 创建元素
///
/// 下标，从0开始
private void CreateItem(int dataIndex)
{
TableViewItem item;
if (unUseItem.Count > 0)
{
item = unUseItem.Dequeue();
}
else
{
item = AddChild(itemPrefab, content).AddComponent();
}
item.Index = dataIndex;
SetPostion(item);
listItem.Add(item);
}
private void SetPostion(TableViewItem item)
{
var index = item.Index;
if (index >= 0)
{
RectTransform cellRectTrans = item.gameObject.GetComponent();
switch (arrangement)
{
case TableView.Arrangement.Vertical:
//float pivotX = maxPerLine == 1 ? 0.5f : 1.0f; //多行多列时候向左靠齐
cellRectTrans.anchorMin = new Vector2(0.5f, 1f);
cellRectTrans.anchorMax = new Vector2(0.5f, 1f);
cellRectTrans.pivot = new Vector2(0.5f, 1f);
break;
case TableView.Arrangement.Horizontal:
cellRectTrans.anchorMin = new Vector2(0f, 0.5f);
cellRectTrans.anchorMax = new Vector2(0f, 0.5f);
cellRectTrans.pivot = new Vector2(0f, 0.5f);
break;
}
cellRectTrans.localPosition = GetLocalPositionByIndex(index);
//cellRectTrans.anchoredPosition3D
if (SetItemCall != null)
{
item.gameObject.name = (index < 10) ? ("0" + index) : ("" + index);
SetItemCall(item.gameObject, index);
}
}
}
///
/// 实例化预设对象 、添加实例化对象到指定的子对象下
///
private GameObject AddChild(GameObject goPrefab, Transform parent)
{
if (goPrefab == null || parent == null)
{
Debug.LogError("异常 TableView.cs AddChild(goPrefab = null || parent = null)");
return null;
}
GameObject goChild = GameObject.Instantiate(goPrefab) as GameObject;
//goChild.layer = parent.gameObject.layer;
goChild.SetActive(true);
goChild.transform.SetParent(parent, false);
return goChild;
}
#endregion
#region 公共接口
///
/// 添加当前数据索引数据
///
/// 下标，从0开始
public void AddItem(int dataIndex)
{
if (dataIndex < 0 || dataIndex > dataCount)
{
return;
}
//检测是否需添加gameObject
bool isNeedAdd = false;
for (int i = listItem.Count - 1; i >= 0; i--)
{
TableViewItem item = listItem[i];
if (item.Index >= (dataCount - 1))
{
isNeedAdd = true;
break;
}
}
SetDataCount(dataCount + 1);
if (isNeedAdd)
{
for (int i = 0; i < listItem.Count; i++)
{
TableViewItem item = listItem[i];
int oldIndex = item.Index;
if (oldIndex >= dataIndex)
{
item.Index = oldIndex + 1;
}
item = null;
}
SetUpdateRectItem(GetCurScrollPerLineIndex());
}
else
{
//重新刷新数据
for (int i = 0; i < listItem.Count; i++)
{
TableViewItem item = listItem[i];
int oldIndex = item.Index;
if (oldIndex >= dataIndex)
{
item.Index = oldIndex;
}
item = null;
}
}
}
///
/// 删除当前数据索引下数据
///
/// 索引下标，从0开始
public void DelItem(int dataIndex)
{
if (dataIndex < 0 || dataIndex >= dataCount)
{
return;
}
//删除item逻辑三种情况
//1.只更新数据，不销毁gameObject,也不移除gameobject
//2.更新数据，且移除gameObject,不销毁gameObject
//3.更新数据，销毁gameObject
bool isNeedDestroyGameObject = (listItem.Count >= dataCount);
SetDataCount(dataCount - 1);
for (int i = listItem.Count - 1; i >= 0; i--)
{
TableViewItem item = listItem[i];
int oldIndex = item.Index;
if (oldIndex == dataIndex)
{
listItem.Remove(item);
if (isNeedDestroyGameObject)
{
GameObject.Destroy(item.gameObject);
}
else
{
item.Index = -1;
unUseItem.Enqueue(item);
}
}
if (oldIndex > dataIndex)
{
item.Index = oldIndex - 1;
}
}
SetUpdateRectItem(GetCurScrollPerLineIndex());
}
///
/// 获取当前index下对应Content下的本地坐标
///
/// 下标，从0开始
///
/// 获取所在的下标
///
/// 对象
/// ();
return listItem.IndexOf(item);
}
#endregion
#region 初始化接口
///
/// 动态初始化tableview
///
/// 滑动区域，监听滑动
/// 滑动列表容器
/// 滑动cell
public void InitTableView(ScrollRect rect, RectTransform cont, GameObject prefab)
{
scrollRect = rect;
content = cont;
itemPrefab = prefab;
if (CheckArgeIsNull())
{
return;
}
}
///
/// 重设列表
///
/// 列表长度
public void ReLoad(int dataCount)
{
//移除
for (int i = listItem.Count - 1; i >= 0; i--)
{
TableViewItem item = listItem[i];
listItem.Remove(item);
GameObject.Destroy(item.gameObject);
}
SetDataCount(dataCount);
unUseItem.Clear();
SetUpdateRectItem(0);
StartCoroutine(StartContinue());
}
///
/// 初始化列表
///
/// 列表长度
public void InitList(int dataCount)
{
if (CheckArgeIsNull())
{
return;
}
if (dataCount <= 0)
{
return;
}
SetDataCount(dataCount);
unUseItem.Clear();
listItem.Clear();
SetUpdateRectItem(0);
scrollRect.onValueChanged.RemoveAllListeners();
scrollRect.onValueChanged.AddListener(OnValueChanged);
StartCoroutine(StartContinue());
}
#endregion
void Awake()
{
}
void OnDestroy()
{
}
}
tableViewCell的代码：
using UnityEngine;
using System.Collections;
///
/// @desc: 滑动列表单个组件
/// @author: Rambo
///
[DisallowMultipleComponent]
public class TableViewItem : MonoBehaviour
{
private int index;
///
/// 设置小孩下标
///
public int Index
{
set
{
index = value;
}
get
{
return index;
}
}
}