先铺垫一下ScrollView
Unity中常用的ScrollView 是 Unity 中的一个常见 UI 组件,主要用于创建可滚动的视图。当内容超过其显示区域时,ScrollView 可以让用户通过滚动查看全部内容。它通常包含一个显示区域和一个内容区域,内容区域可以超过显示区域的大小,用户可以上下、左右拖动或滚动查看超出范围的内容。
ScrollView 组件的组成部分:
Viewport(视口):这是 ScrollView 中的可视区域。内容区域超过这个区域后会被裁剪掉,只有在这个区域内的内容可见。
Content(内容):这是实际显示的内容,可以是图片、文本、按钮等其他 UI 元素。Content 通常会比 Viewport 大。
Scrollbar(滚动条):这是一个可选的子组件,可以让用户通过滚动条来滚动内容。ScrollView 可以有水平和垂直两个方向的滚动条。
当你有一段超出当前显示区域的内容时,比如列表、大段文本、图片库等,你可以使用 ScrollView 组件来创建一个可滚动的界面,让用户能够查看所有的内容而不需要改变界面布局。


我常规使用该组件的时候通常都会出现该结构,一般我会删掉水平滑动条,然后在content中添加布局组件,然后我先Resources.Load加载item(这里有人会将制成的item直接放到content下,生成item前拿到这个提前放置的item),然后克隆item.
如果item功能复杂我会为Item创建一个脚本,功能写在这个脚本中,否则直接写在生成Item的脚本中.数量如果多到成百上千可能会使用对象池做优化.这样一套下来自己实现实在烦累,本插件就很好的为我们做了上面的工作.
本文旨在帮助你快速了解该插件,以及介绍一下常见用法.
1.概述
在UGUI SuperScrollView包中,有三个主要组件:LoopListView2、LoopGridView 和 LoopStaggeredGridView。
LoopListView2、LoopGridView 和 LoopStaggeredGridView 这些组件都附加在同一个UGUI的ScrollRect游戏对象上。
它们用于帮助UGUI的ScrollRect支持任意数量的项目,同时提供高性能和节省内存的功能。你可以理解为为ScrollRect组件拓展了功能.
该包中包含88个示例,这些示例都使用了上述三个组件之一。
插件的Demo目录下包含大量示例场景,这些示例都使用了上述三个组件之一,如下分类

你可以稍后看示例,先跳转到示例之后的核心组件部分,三大核心组件是本插件的核心
1. List View(列表视图)
使用 LoopListView2 组件,提供各种从列表滚动的方向、删除、加载更多、筛选等功能:
基础滚动效果:
从上到下、左到右、下到上、右到左的滚动。
交互效果:
选择和删除项、下拉刷新、上拉加载更多、点击加载更多等。
高级功能:
多种预制件展示、内容自适应、简单循环列表(类似于无限滚动)。
2. Grid View(网格视图)
使用 LoopGridView 组件,网格布局的滚动和交互效果,适用于需要在二维空间展示数据的情况:
基础滚动效果:
同样支持从上到下、左到右、下到上、右到左的滚动。
高级效果:
多预制件网格、斜向滚动、多样筛选和交互。
3. Staggered View(错位视图)
使用 LoopStaggeredGridView 组件,与 Pinterest 风格相似,适合不规则高度(垂直方向)或宽度(水平方向)的项目展示:
滚动效果:
垂直和水平错位滚动。
交互效果:
移动到指定项目,适合展示图片墙等复杂布局。
4. Special Grid View(特殊网格视图)
使用 LoopListView2,类似于网格视图,但带有特殊功能:
高级交互:
支持删除、下拉刷新、加载更多等操作,通常用于带有特殊展示效果的网格布局。
5. Responsive View(响应式视图)
同样使用 LoopListView2,该视图专注于自适应屏幕大小,适合不同设备分辨率:
主要功能:
动态调整视图布局,支持刷新和加载。
6. Chat View(聊天视图)
使用 LoopListView2,模拟聊天界面:
特色功能:
支持聊天内容的自动加载与刷新,支持改变视口高度来适应窗口大小。
7. Gallery(画廊视图)
使用 LoopListView2,适用于展示图片或内容轮播:
展示方式:
水平或垂直展示图片的画廊效果。
8. Tree View(树状视图)
使用 LoopListView2,用于显示分级树状结构的项目:
树结构效果:
支持树节点的嵌套、头部保持静止,以及项目的动态添加或删除。
9. Page View(分页视图)
使用 LoopListView2,用于分屏展示内容:
主要功能:
适合用于分页式的内容展示,如幻灯片或分步教程。
10. Spin View(旋转选择器)
使用 LoopListView2,适合日期或时间选择器:
主要功能:
支持日期、时间的滚动选择。
11. Nested View(嵌套视图)
支持 LoopListView2 和 LoopGridView 组件,允许嵌套视图布局:
嵌套效果:
可以嵌套列表和网格布局,适合复杂的视图结构展示。
12. List View Animation(列表视图动画)
为列表视图添加动画效果:
动画类型:
项目添加、删除、展开时的剪切、淡入淡出、左右滑动等动画。
13. Draggable View(可拖动视图)
支持拖动项目的列表视图:
拖动效果:
列表项可以通过拖动重新排序。
2.核心组件
LoopListView2
(Demo/ListView/ListViewTopToBottomDemo查看该示例)

LoopListView2 概述
对于一个包含10,000个item的 ScrollRect,LoopListView2 实际上并不会真正创建10,000个,而是根据 视口的大小创建少量item。
当 ScrollRect 向上滚动时,LoopListView2 组件会检查最顶部项目的位置。一旦最顶部的项目超出视口范围,LoopListView2 组件就会回收该item。
与此同时,它会检查最底部item的位置,一旦最底部的项目接近视口底部时,LoopListView2 组件会调用 onGetItemByIndex 来创建一个新item,并将新创建的定位在最底部.
每个item可以使用不同的预制件,并且可以有不同的高度、宽度和间距。
简而言之 ScrollRect 有10,000个项目,但实际上只会根据视口创建有限个。
使用了该组件,那么content上不用添加任何布局组件了!
并且不需要更改Item的锚点类型,Item保持默认锚点类型.
LoopListView2 的核心属性解析

1. ItemPrefabList(Item 预制件列表)
作用:该列表包含了 ScrollView 中所有使用的 Item 预制件(Prefab)。每个 Item 可以使用不同的 Prefab,且每个 Prefab 可以定义自己的 default padding(内边距),即 ScrollRect 中每个 Item 之间的间隔。
(X/Y)PosOffset:在 Vertical ScrollRect(垂直滚动视图)中为 X 轴位置偏移;在 Horizontal ScrollRect(水平滚动视图)中为 Y 轴位置偏移。这些偏移值控制了每个 Item 在初始状态下的位置。
对象池机制(Object Pool):每个 Prefab 都有一个对象池用于复用 Item,避免频繁创建和销毁对象。InitCreateCount 表示在初始化时池中预创建的 Item 数量。
动态调整:你可以在运行时通过 onGetItemByIndex 回调为每个 Item 动态调整 padding 和 PosOffset。
使用 LoopListViewItem2.Padding 和 LoopListViewItem2.StartPosOffset 可以获取或设置这些属性。
注意:所有 Item 的 localScale(本地缩放比例)必须为 (1,1,1),否则会导致布局异常。

2. SupportScrollbar(支持滚动条)
作用:勾选该选项后,LoopListView2 组件将支持与滚动条同步。用户拖动滚动条时,列表内容会相应滚动。
3. ItemSnapEnable(启用 Item 吸附)
作用:启用此选项后,当滚动结束时,组件会自动将某个 Item 吸附(Snap) 到预设的位置,提升交互体验。常用于居中或边界吸附。
4. ItemSnapPivot(Item 吸附枢轴点)
作用:该属性定义 Item 自身的吸附枢轴点,采用 归一化比例坐标:
(0,0) 表示 Item 的左下角。
(1,1) 表示 Item 的右上角。
常见配置:(0.5, 0.5) 表示吸附在 Item 的中心。
5. ViewPortSnapPivot(视口吸附枢轴点)
作用:该属性定义 ScrollRect Viewport 的吸附枢轴点,决定 Item 吸附时在 Viewport 中的位置。同样使用归一化比例坐标:
(0,0) 表示 Viewport 的左下角。
(1,1) 表示 Viewport 的右上角。
常见配置:(0.5, 0.5) 表示吸附在 Viewport 的中心。
6. ArrangeType(排列方向)
设置滚动视图(ScrollRect)的滚动方向,决定了 ScrollRect 中 Item 的排列顺序和方向。根据方向的不同,有以下四种类型:
TopToBottom(从上到下)
使用场景:适用于 垂直 ScrollRect。
排列方式:Item 会按照 item0, item1, ..., itemN 的顺序,从 上到下 依次排列在 Viewport 中。
示例:常见于聊天列表或消息通知列表。
BottomToTop(从下到上)
LeftToRight(从左到右)
RightToLeft(从右到左)
LoopListView2 重要公共方法解析
1)InitListView 方法

作用:该方法用于初始化 LoopListView2 组件,并且需要传入 3个参数:
参数 1:itemTotalCount(Item 总数)
作用:设置滚动视图中 Item 的总数。
值为 -1:表示 Item 数量是无限的,此时不支持滚动条(Scrollbar)。ItemIndex 的范围从 负无穷到正无穷.
值为 >= 0:表示 Item 数量是有限的,ItemIndex 的范围从 0 到 itemTotalCount - 1。
参数 2:onGetItemByIndex(获取 Item 回调函数)
概括的说:
我们的滚动视窗UI更新的时候(即当某个 Item 进入 ScrollRect 的 Viewport时,系统会调用该回调函数),content下的Item将会生成.
Item需要初始化(比如更新文字,图片,绑定事件),那么我们要在这个回调函数中进行这些操作(最好是Item上有一个组件,直接获取组件并调用Init方法,同时该组件上还有一个UpdateUi的方法更新UI).
这个回调将为我们提供LoopListView2 自身和Item在视窗中的索引(这个索引即index最好和数据索引对应上,比如和List的索引对应),返回给我们一个LoopListViewItem2,每个创建的 Item 都会被自动绑定一个 LoopListViewItem2 组件。
一个官方示例

可以看到先判断索引,然后获取数据(这个数据是你自己的数据)
然后通过LoopListViewItem2 .NewListViewItem方法生成一个Item,你可以通过传入不同的预制件名称来改变样式(这里还返回一个自动为你添加的LoopListViewItem2 组件).
这个名称就是刚才ItemPrefabList中你添加进列表中的(当然一般就一种).然后通过NewListViewItem返回的Item你可以获取自己的组件,更新UI,绑定方法等等,这部分会在最后的例子中进一步说明.
LoopListViewItem2
onGetItemByIndex 回调函数的返回值


LoopListViewItem2 相关的public属性
1. ItemIndex
类型:int
说明:表示该项在列表中的索引。如果列表的 itemTotalCount 设置为 -1(无限项),则 ItemIndex 可以从 -MaxInt 到 +MaxInt。如果 itemTotalCount >= 0,则 ItemIndex 必须在 0 到 itemTotalCount - 1 之间。
2. ItemId
类型:int
说明:用户自定义的项 ID。可以设置为任何整数值,用于标识该项,通常用于搜索或其他特定用途。
3. ParentListView
类型:LoopListView2
说明:该项所属的父列表视图。LoopListView2 是管理整个列表滚动和项目布局的类。
4. ItemPrefabName
类型:string
说明:该项的预制体名称,用于标识该项对应的预制体。
5. IsInitHandlerCalled
类型:bool
说明:指示该项的初始化处理程序是否已调用。通常在创建项时用于判断是否初始化该项。
6. DistanceWithViewPortSnapCenter
类型:float
说明:该项与视口中心的距离。
7. StartPosOffset
类型:float
说明:项在列表中显示时的起始位置偏移量。
8. ItemCreatedCheckFrameCount
类型:int
说明:创建项时的检查帧数。这个值可以用来控制项创建的帧数。
9. Padding
类型:float
说明:项的内边距(即项之间的间距)。
10. CachedRectTransform
类型:RectTransform
说明:该项的 RectTransform,用于获取项的位置、大小等信息。只有在需要时才会缓存该引用。
11. UserObjectData、UserIntData1、UserIntData2、UserStringData1、UserStringData2
类型:object、int、string
说明:这些是用户自定义的数据存储字段,可以用于存储与项相关的额外信息。这些字段通常用于存储特定的标识符或其他数据,以便在回调或事件处理中使用。
12. TopY、BottomY、LeftX、RightX
类型:float
说明:这些属性表示项在 RectTransform 中的边界位置(相对于其父容器的 RectTransform,这个父容器一般就是content)。
TopY 和 BottomY 代表项的上下位置(垂直布局时使用)。
LeftX 和 RightX 代表项的左右位置(水平布局时使用)。
比如竖直视窗,第一个Item的TopY就是0,第二个就是第一个Item的高度加两者之间的间距.
13. ItemSize
类型:float
说明:表示项的大小。如果列表是垂直布局,则返回项的高度;如果是水平布局,则返回项的宽度。
14. ItemSizeWithPadding
类型:float
说明:返回项的大小(包括内边距)。用于计算项占用的实际空间。
比如竖直视窗,就是项的高度加上项之间的间距.
参数3 LoopListView InitParam :
一个可选参数,用于初始化配置。这个对象允许你自定义一些初始化参数,而不需要每次通过代码或 Inspector 手动设置。你可以用它来控制 ScrollRect 的布局和行为。
LoopListView InitParam 的常见属性
以下是该参数的常见配置项:
mItemDefaultSize:
每个项的默认尺寸(宽度或高度,取决于垂直或水平布局)。
当项的大小未显式设置时使用。
mDistanceForRecycle0:
当项从视口中滚动超出此距离时会被回收。
mDistanceForNew0:
当视口内需要显示新的项时,达到此距离会触发加载。
mItemPadding:
每个项之间的间距。
mSmoothDumpRate:
平滑滚动的速率。
mSnapMoveSpeed:
对齐滚动的速度。
mItemSnapEnable:
是否启用项的对齐功能。
2) NewListViewItem Method
![]()
刚才提到就不赘述了
3)SetListItemCount Method
![]()
作用:用于在运行时设置滚动视图中的 Item 总数。
参数为 -1:表示列表中的 Item 数量是无限的,此时不支持滚动条,并且 ItemIndex 范围从 -MaxInt 到 +MaxInt。
参数 >= 0:表示 Item 数量有限,ItemIndex 范围为 0 到 itemTotalCount - 1。
resetPos 参数:
true:调用该方法后会重置 ScrollRect 内容的位置。
false:调用后 ScrollRect 的内容位置保持不变。
4) GetShownItemByItemIndex 方法
![]()
作用:根据ItemIndex 获取当前可见的 Item。
返回值:如果该 itemIndex 对应的 Item 不可见,则返回 null。
5) GetShownItemByItemId 方法
![]()
作用:根据用户自定义的 itemId 获取当前可见的 Item。
返回值:如果该 itemId 对应的 Item 不可见,则返回 null。
6) GetShownItemByIndex 方法
![]()
作用:根据可见列表中的索引获取 Item。
所有可见的 Item 存储在一个 List<LoopListViewItem2> 中,名为 mItemList。
参数:index 的范围为 0 到 mItemList.Count - 1。
7) ShowItemCount 方法

作用:获取当前可见 Item 的总数。
8) RefreshItemByItemIndex 方法
![]()
作用:根据 itemIndex 更新指定的 Item。
如果该 itemIndex 对应的 Item 不可见,则该方法不会执行任何操作。
如果可见,则会调用 onGetItemByIndex(itemIndex) 获取更新后的 Item,并重新定位所有可见 Item。
9) RefreshAllShownItem 方法
![]()
作用:更新所有可见的 Item。
10) MovePanelToItemIndex 方法
![]()
作用:将 ScrollRect 的内容位置移动到指定 itemIndex 的位置,并且加上一个偏移量 offset。
itemIndex 的范围为 0 到 MaxInt。
offset 的范围为 0 到 ScrollRect Viewport 的尺寸。
11) OnItemSizeChanged 方法
![]()
作用:当一个可见的 Item 的尺寸(高度或宽度)在运行时发生变化时,需要调用此方法以重新排列所有可见的 Item。
垂直 ScrollRect:如果高度变化,调用此方法重新排列。
水平 ScrollRect:如果宽度变化,调用此方法重新排列。
12) FinishSnapImmediately 方法
![]()
作用:立刻完成吸附(Snap),无需动画过渡。
13) CurSnapNearestItemIndex 方法
![]()
作用:获取与 Viewport 吸附点最近的 Item 的索引。
14) SetSnapTargetItemIndex 方法
![]()
作用:设置吸附的目标 Item 索引。该方法通常用于分页视图(PageView)场景。
15) ClearSnapData 方法
![]()
作用:清除当前的吸附目标,组件会自动吸附到 CurSnapNearestItemIndex。
16) GetFirstShownItemIndexAndOffset 方法
![]()
作用:获取列表视图中第一个可见 Item 的索引和偏移量。
返回值:ItemPosStruct,包含两个属性:
mItemIndex:第一个可见 Item 的索引。
mItemOffset:该 Item 的偏移量。
LoopGridView
LoopGridView 概述
三大组件还是比较像的,基本上换汤不换药
LoopGridView 组件附加在与 UGUI ScrollRect 相同的游戏对象上。它主要用于所有项具有相同大小,并且行数或列数是固定的 网格视图(GridView)。ScrollRect 可以同时进行水平和垂直滚动。
例如,对于一个包含 10,000 个项的网格(100 行 × 100 列),LoopGridView 实际上不会创建 10,000 个项,而是根据视口的大小动态创建少量的项。
当 ScrollRect 向上滚动时,LoopGridView 会检查最上方行的位置。一旦最上方的行超出视口,组件会将该行的所有项回收。
与此同时,它也会检查最下方行的位置,当该行接近视口底部时,LoopGridView 会调用 onGetItemByRowColumn 处理器来创建一个新行,并将新创建的行及其项排列在当前最下方行的下方,使新行成为新的最下方行。
每个项可以使用不同的预制体(Prefab)。
尽管网格视图定义了 10,000 个项,但实际上只会创建少量必要的项。以下图示展示了一个 从左上到右下(TopLeftToBottomRight) 排列的 ScrollRect(100 行 × 100 列)的示例:


LoopListView2 的核心属性解析
1) ItemPrefabList(项预制体列表)
要克隆的现有项列表。
每个项可以使用不同的预制体(Prefab)。每个预制体都拥有一个用于获取和回收的池(pool),并且 InitCreateCount 设置了启动时在池中创建的项数量。
重要提示:所有预制体的 localScale 必须设置为 (1,1,1),而 ScrollRect 的内容对象的 localScale 也必须设置为 (1,1,1)。
2) GridFixedType(网格固定类型)
此属性的值可以是 ColumnCountFixed(列数固定) 或 RowCountFixed(行数固定)。
这个属性类似于 UGUI 的 GridLayoutGroup.constraint 和 GridLayoutGroup.startAxis,即确定首先沿哪个轴方向排列项。
3) RowCount / ColumnCount(行数 / 列数)
如果 GridFixedType 设置为 ColumnCountFixed,则需要设置网格的列数。
如果设置为 RowCountFixed,则需要设置网格的行数。
此属性类似于 UGUI 的 GridLayoutGroup.constraintCount。
4) Padding(内边距)
定义项与视口之间的间距。此属性类似于 UGUI 的 GridLayoutGroup.Padding。
5) ItemSize(项大小)
设置项的大小。如果 x 或 y 的值为 0,则在初始化 LoopGridView 组件时,项的大小会自动设置为 ItemPrefabList 中第一个预制体的大小。
6) ItemPadding(项间距)
定义网格中每个项之间的间距。
7) RecycleDistance(回收距离)
当项离开视口达到此距离时,该项会被回收。
8) ItemSnapEnable(项对齐启用)
启用此选项后,LoopGridView 组件会尝试将项对齐到配置的位置。
9) ItemSnapPivot(项对齐锚点)
定义项对齐的锚点位置,值为矩形大小的比例。(0,0)表示左下角,而(1,1)表示右上角。
10) ViewPortSnapPivot(视口对齐锚点)
定义 ScrollRect 视口 的对齐锚点位置,值为矩形大小的比例。(0,0)表示左下角,而(1,1)表示右上角。
11) ArrangeType(排列类型)
定义滚动方向,有四种排列方式:
TopLeftToBottomRight(从左上到右下)
BottomLeftToTopRight(从左下到右上)
TopRightToBottomLeft(从右上到左下)
BottomRightToTopLeft(从右下到左上)
LoopGridView重要公共方法解析
1) InitGridView Method

初始化 LoopGridView 组件,包含以下参数:
itemTotalCount:GridView 的总项数,必须为 >=0,项索引范围为 0 至 itemTotalCount - 1。
onGetItemByRowColumn:当项出现在 ScrollRect 视口中时触发,负责创建项并更新其内容,三个int参数顺序为 itemIndex、row、column。
settingParam:LoopGridViewSettingParam 对象,用于在代码中覆盖 Inspector 的默认设置。
LoopGridViewItem:onGetItemByRowColumn 回调的返回值,带有 mItemIndex(索引)和 mItemId(ID)。ID 在创建或从池中获取时设置,回收到池前不会更改。

这个组件和前面提到的类似,也是自动附加的.

2) NewListViewItem Method
![]()
从指定的预制体克隆一个新项,通常在 onGetItemByRowColumn 回调中使用。
3)SetListItemCount Method
![]()
动态设置 GridView 的总项数。若 resetPos 为 false,ScrollRect 的内容位置不会改变。
4) GetShownItemByItemIndex Method
![]()
根据 itemIndex 获取可见项,若不可见则返回 null。
5)GetShownItemByRowColumn Method
![]()
根据 (row, column) 获取可见项,若不可见则返回 null。
6)RefreshItemByItemIndex Method
![]()
更新指定 itemIndex 的项内容,若该项不可见则不会执行任何操作。
7)RefreshItemByRowColumn Method
![]()
根据 (row, column) 更新项内容,若该项不可见则不会执行任何操作。
8)RefreshAllShownItem Method
![]()
更新所有当前可见项的内容。
9)MovePanelToItemByIndex Method
![]()
将 ScrollRect 的内容移动到指定 itemIndex 项的位置,并添加偏移量。
10)MovePanelToItemByRowColumn Method
![]()
将面板移动到 (row, column) 位置的项,并添加偏移量。
11)SetGridFixedGroupCount Method
![]()
动态更改 GridFixedType 和固定的行/列数,同时可以设置项大小、间距和内边距。
12)FinishSnapImmediately Method
![]()
立即完成当前对齐操作。
13)RowColumnPair Method
![]()
获取视口对齐点附近项的 (row, column)。
14)SetSnapTargetItemRowColumn Method
![]()
设置要对齐的目标项的 (row, column)。
15)ClearSnapData Method
![]()
清除当前对齐目标,使 LoopGridView 自动对齐到最近的项。
LoopStaggeredGridView

LoopStaggeredGridView 概述
LoopStaggeredGridView 主要用于 瀑布流布局(Staggered GridView),适用于垂直 GridView 中项的高度不同(或水平 GridView 中项的宽度不同)的情况。如果 GridView 中的所有项尺寸相同,建议使用 LoopGridView。
LoopStaggeredGridView 类似于 LoopListView2。对于一个包含 10,000 个项的 ScrollRect,LoopStaggeredGridView 不会一次性创建 10,000 个项,而是根据视口大小动态创建少量的项。
功能描述
滚动时项的管理:
在 垂直 GridView 中,当 ScrollRect 向上滚动时,LoopStaggeredGridView 会检查 每列最上方项的位置。
一旦某列的最上方项超出视口,组件会将该项回收。
同时,组件会检查 每列最下方项的位置。当某列的最下方项接近视口底部时,组件会调用 onGetItemByIndex 回调来创建一个新项,并将其放置在该列最下方项的下方。
新项会优先添加到当前所有列中底部位置最高的那一列,即最短列的末尾。
项的排列规则:
项的排列遵循从左到右、从上到下的顺序。
不同尺寸的项:
在垂直 GridView 中,项可以有不同的高度,但必须有相同的宽度。
在水平 GridView 中,项可以有不同的宽度,但高度必须相同。
性能优化:
即使 GridView 包含 10,000 项,实际创建的项数量也取决于视口大小。

LoopStaggeredGridView 的核心属性解析
和前文一样不赘述.
重要提示:所有itemPrefab的localScale必须为(1,1,1)。
LoopStaggeredGridView 重要公共方法解析
- InitListView Method

初始化 LoopStaggeredGridView 组件,包含以下参数:
itemTotalCount:
ScrollView 中的总项数,必须设置为 >= 0。
layoutParam:
GridViewLayoutParam 实例,用于设置布局参数。

这个参数就是说你是想做垂直 GridView 中项的高度不同(或水平 GridView 中项的宽度不同)的情况。
垂直 GridView:
mColumnOrRowCount:列数。
mItemWidthOrHeight:项的宽度。
mPadding1:视口左边距。
mPadding2:视口右边距。
水平 GridView:
mColumnOrRowCount:行数。
mItemWidthOrHeight:项的高度。
mPadding1:视口上边距。
mPadding2:视口下边距。
如果 mCustomColumnOrRowOffsetArray 为 null,则平均排列列或行。
如果 mCustomColumnOrRowOffsetArray 不为 null,数组中的值表示每列/行的 X 或 Y 偏移量,数组长度必须等于 mColumnOrRowCount。
onGetItemByItemIndex:
当项进入 ScrollRect 视口时触发,用于创建和更新项内容。
onGetItemSizeByItemIndex(可选):
如果你能提前知道每个项的大小,可以设置此回调,返回指定 itemIndex 的大小和内边距。
如果无法提前知道项大小,MovePanelToItemIndex 方法只能移动到曾经出现在视口中的项。
如果能提前知道项大小,则可以先调用 UpdateContentSizeUpToItemIndex(itemIndex) 确保布局完成,再调用 MovePanelToItemIndex(itemIndex) 进行移动。
LoopStaggeredGridViewItem:
onGetItemByItemIndex 的返回值,自动附加 LoopStaggeredGridViewItem 组件。
mItemIndex:项的索引,范围为 0 到 itemTotalCount - 1。
mItemIndexInGroup:项在列/行中的索引,垂直 GridView 中表示列,水平 GridView 中表示行。
mItemId:项的 ID,在创建或从池中获取时设置,直到回收到池中之前不会更改。
2) NewListViewItem Method
![]()
从指定的预制体 itemPrefabName 克隆一个新项,通常在 onGetItemByItemIndex 回调中使用。
3) SetListItemCount Method
![]()
动态设置 GridView 的总项数。
如果 resetPos 为 false,ScrollRect 的内容位置不会改变。
4) GetShownItemByItemIndex Method
![]()
根据 itemIndex 获取可见项,如果该项不可见,则返回 null。
5) RefreshItemByItemIndex Method
![]()
更新指定 itemIndex 的项内容,如果该项不可见则不会执行任何操作。
如果可见,则会先调用 onGetItemByItemIndex(itemIndex) 获取更新后的项,并重新排列同一组(列/行)中的所有可见项。
6) RefreshAllShownItem Method
![]()
更新所有当前可见项的内容。
7) MovePanelToItemIndex Method
![]()
将 ScrollRect 的内容移动到指定 itemIndex 的项位置,并加上偏移量。
8) OnItemSizeChanged Method
![]()
垂直 ScrollRect:如果可见项的高度在运行时发生变化,需要调用此方法重新排列同一列中的所有可见项。
水平 ScrollRect:如果可见项的宽度在运行时发生变化,需要调用此方法重新排列同一行中的所有可见项。
好的目前已经将核心组件的多数内容介绍完了!
实践一下
现在我们使用最简单的情况使用一下LoopListView2 组件做一个滚动视窗



创建一个ScrollView,和item,在和ScrollRect同级的物体上添加我们的LoopListView2组件
注意将ScrollRect组件的Visibility属性调整为Auto Hide.
将Item放到列表中,设置一下ItemPadding调整一下Item之间的间距.


在合适的地方初始化我们的LoopListView2 组件,在回调中初始化我们的item,这就是一个最简单Demo.
效果



















![[补充]原码、反、补、移码的转换](https://i-blog.csdnimg.cn/direct/b18ed678723d4b14a1ebb60d56c81827.png)
