[UGUI]ListLayoutGroup--可重用的滚动列表
Posted U3D及其他
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了[UGUI]ListLayoutGroup--可重用的滚动列表相关的知识,希望对你有一定的参考价值。
一、相同cell size的可重用列表:
为了不生成太多的GameObject,当滚动的时候,需要将出框的item重复利用起来。这个网上已经有了很多例子。我为了项目使用方便,在GridLayoutGroup基础上修改了一下,配合ScrollRect使用
首先在传入数据的时候,需要知道要显示多少数据,为了拖动时看不到突然消失的item,会多显示一个:
private float GetScrollRectSize() { var rectSize = m_scrollRect.rectTransform.rect.size; return IsVertical ? rectSize.y : rect.y; } private float GetCellSize() { return IsVertical ? cellSize.y + spacing.y : cellSize.x + spacing.x; } public void SetData<P, D>(ICollection<D> dataList, System.Action<int, P, D> setContentHandler) where P : MonoBehaviour { ........ displayListCount = Mathf.CeilToInt(GetScrollRectSize () / GetCellSize()) + 1; ....... }
在滚动的时候,首先需要知道最左上角的数据index:
public int GetStartIndex() { if (m_dataList == null || m_dataList.Count == 0) return 0; float anchorPosition = IsVertical ? rectTransform.anchoredPosition.y : rectTransform.anchoredPosition.x; if(!IsVertical) anchorPosition *= -1; anchorPosition -= GetCellSize() * 0.5f - GetPadding(); return (int)(anchorPosition / GetCellSize()) * constraintCount; }
为了不产生其他开销,Item的实际顺序不会改动,这就需要在已有的顺序中对其在数据中的实际顺序做映射,举个例子,如果一屏可以显示四个数据,那么对应不同的startIndex,四个item的映射关系如下:
Start Index | Actual Index |
0 | 0 1 2 3 |
1 | 4 1 2 3 |
2 | 4 5 2 3 |
如下公式可得到Actual Index(对于无限滚动的列表,start index可能小于0):
private int GetActualIndex(int startIndex, int index) { var count = GetChildCount(); return ((startIndex + (startIndex >= 0 ? (count - index - 1) : -index)) / count * count + index); }
滚动时,可根据Actual Index设置Item的位置,并对比滚动前的Actual Index是否改变,决定是否更新数据:
private void SetCellsAlongAxis (int axis) { ...... for(int i = 0; i < childCount; ++i) { var child = childList[i]; ... if (IsVertical) { positionX = Mathf.Abs(actualIndex) % cellsPerMainAxis; positionY = actualIndex / cellsPerMainAxis; } else { positionX = actualIndex / cellsPerMainAxis; positionY = Mathf.Abs(actualIndex) % cellsPerMainAxis; } if (cornerX == 1) positionX = actualCellCountX - 1 - positionX; if (cornerY == 1) positionY = actualCellCountY - 1 - positionY;
......
if(actualIndex != previousIndex) { SetItemContent(acutalIndex, child, m_dataList[i]); } SetChildAlongAxis (child, 0, startOffset.x + (cellSize [0] + spacing [0]) * positionX, cellSize [0]); SetChildAlongAxis (child, 1, startOffset.y + (cellSize [1] + spacing [1]) * positionY, cellSize [1]); }
}
二 不同cell size的可重用列表
在一的基础上稍微做一下修改
为了滚动条大小正确,需要提前知道计算出data对应的cell size
protected List<Vector2> m_sizeList = new List<Vector2>(); protected List<float> m_positionList = new List<float>(); protected float m_minSize = float.MaxValue;//同屏item的最大数量由这个决定
public void ReCalcItemSize(bool rebuildSizeList = false) { if (m_getSizeHandler == null)//外部传入,计算data对应的cell size return; if(rebuildSizeList) m_sizeList.Clear (); m_positionList.Clear (); m_minSize = float.MaxValue; m_otherMaxSize = 0f; float totalSize = 0f; m_positionList.Add (0); for (int i = 0; i < m_dataList.Count; ++i) { var size = Vector2.zero; if (rebuildSizeList) { size = m_getSizeHandler (i, m_dataList [i]); } else { size = m_sizeList [i]; } var cur = (isVertical ? size.y : size.x); m_minSize = Mathf.Min (cur, m_minSize); m_otherMaxSize = Mathf.Max ((isVertical ? size.x : size.y), m_otherMaxSize); if(rebuildSizeList) m_sizeList.Add (size); totalSize += cur + spacing; m_positionList.Add (totalSize); } m_displayListCount = Mathf.CeilToInt(GetScrollRectSize() / (m_minSize + spacing)); ... }
接着需要重写方法,让ScrollRect得到正确的滚动范围:
public override void CalculateLayoutInputHorizontal() { CalcAlongAxis(0, isVertical); } public override void CalculateLayoutInputVertical() { CalcAlongAxis(1, isVertical); }
protected void CalcAlongAxis(int axis, bool calcVertical) { if (m_ScrollRect == null) return; float combinedPadding = (axis == 0 ? padding.horizontal : padding.vertical); float totalMin = combinedPadding; bool alongOtherAxis = (calcVertical ^ (axis == 1)); if (alongOtherAxis) totalMin += m_otherMaxSize; if (!alongOtherAxis && m_positionList.Count > 0) { totalMin += m_positionList[m_positionList.Count - 1] - spacing; } SetLayoutInputForAxis(totalMin, totalMin, totalMin, axis); }
最后计算StartIndex也要做一下修改:
protected int GetStartIndex() { if (m_dataList == null || m_dataList.Count == 0) return 0; var curPosition = (isVertical ? rectTransform.anchoredPosition.y : rectTransform.anchoredPosition.x); if (isVertical) curPosition -= padding.top; else curPosition = -curPosition - padding.left; int index = 0; for (int i = 0; i < m_positionList.Count; ++i) { if (m_positionList [i] > curPosition) break; index = i; } return index; }
比较繁琐,主要是需要提前计算好所有data对应的cell size,这个是不能省的。
以上是关于[UGUI]ListLayoutGroup--可重用的滚动列表的主要内容,如果未能解决你的问题,请参考以下文章