1. 项目概述为什么我们需要一个“无限滚动”的UI解决方案在Unity里做UI尤其是涉及到列表、背包、排行榜这类需要展示大量数据项的界面时开发者最常遇到的性能瓶颈是什么不是复杂的Shader也不是庞大的模型恰恰是看似简单的“滚动列表”。当你的列表里有成百上千个条目时如果一股脑地把所有UI元素都实例化出来哪怕它们不在屏幕内也会瞬间吃掉大量的Draw Call和内存导致界面卡顿、滑动不流畅在移动设备上尤其致命。这就是“无限滚动”要解决的问题。它的核心思想很简单只渲染当前可视区域内的UI项随着滚动动态复用和更新这些项的内容。想象一下一个拥有1000个条目的通讯录你的手机屏幕一次只能显示10个。无限滚动的机制就是只创建102作为缓冲个UI项当你向下滑动时最上面离开屏幕的项会被回收并立刻填充到最下面即将进入屏幕的位置同时更新其显示的数据。这样无论你的数据源有多大屏幕上实际存在的UI对象数量是恒定的。Unity自带的ScrollRect配合Content Size Fitter和Layout Group能实现基础滚动但它不具备这种“对象池”和“动态复用”的智能。手动实现这套逻辑你需要处理索引计算、对象池管理、数据绑定、滚动事件监听等一系列繁琐且容易出错的工作。因此一个成熟、稳定、易用的无限滚动解决方案对于提升项目UI性能和开发效率至关重要。UIS这里我们指代一种通用的Unity无限滚动解决方案的设计思路和实现正是为此而生它不是一个特定的插件而是一套可以被封装成框架或工具的核心模式。2. UIS核心设计思路与架构拆解一个优秀的无限滚动系统其设计必须兼顾性能、易用性和扩展性。我们不能只满足于“能滚动”更要追求“滑得丝滑”、“用得顺手”、“改得灵活”。下面我们来拆解其核心架构。2.1 数据驱动与视图分离这是现代UI框架的基石在无限滚动中尤为重要。核心思想是数据Model和显示View完全解耦。数据源DataSource 一个抽象的数据集合例如一个ListItemData。它只关心有多少条数据TotalCount以及根据索引index能获取到哪条具体的数据GetData(index)。数据源的变化增、删、改会触发视图的更新。视图项ItemView 一个预制体Prefab代表单个列表项的视觉表现。它不应该直接持有业务数据而是提供一系列SetData(ItemData data)之类的方法用于接收数据并更新内部的Text、Image等UI元素。滚动控制器ScrollController 这是大脑。它持有数据源的引用管理一个对象池Pool来存放和复用ItemView实例。它监听ScrollRect的滚动事件根据当前的滚动位置和方向计算出哪些数据索引应该被显示然后从对象池中取出或创建对应的ItemView调用其SetData方法进行填充并摆放到正确的位置。这种分离的好处是巨大的。你可以随时更换数据源而不影响视图逻辑也可以为同一种数据设计多种不同样式的ItemView只需在控制器中指定不同的预制体即可。2.2 动态布局与位置计算无限滚动的魔法在于“位置计算”。我们需要知道在给定的滚动位置下第一个可见项的数据索引是多少以及每个ItemView应该放在哪里。垂直滚动示例计算假设每个列表项的高度固定为itemHeight滚动内容Content的锚点Pivot在左上角0,1。计算起始索引startIndex Mathf.FloorToInt(-content.anchoredPosition.y / itemHeight)。因为anchoredPosition.y在向下滚动时为负值取负再除以项高得到从顶部开始已经滚过了多少个完整的项。计算可见项数量visibleCount Mathf.CeilToInt(scrollViewport.rect.height / itemHeight)。视口高度除以项高向上取整确保能覆盖整个视口。计算项的位置 对于索引为i的项其本地Y坐标posY -startIndex * itemHeight (i - startIndex) * -itemHeight。这里需要根据具体的锚点和坐标系进行调整核心是位置 起始偏移 索引差 * 项大小。对于网格布局Grid计算会复杂一些需要同时考虑行和列。但原理相通根据滚动偏移量计算出起始的行索引和列索引再遍历填充视口内的所有单元格。注意这里假设了项大小固定。如果支持可变大小项复杂度会指数级上升通常需要预先计算或估算每个项的大小并维护一个“累积位置”的查找表这里不展开但它是一个高级特性。2.3 对象池的精细化管理对象池是性能的关键。但池子不能简单地“创建-回收”需要精细控制。预热Preheat 在列表初始化时根据预估的可见数量预先实例化好一定数量的ItemView放入池中避免在滚动时因突然需要新实例而引发卡顿。回收策略 当一项滚出视口它应该被回收到池中。但回收时需要重置其状态清除数据、取消动画等避免旧数据残留到下一次复用。池容量 池的大小应该略大于最大可见数量如 visibleCount 2。太小会导致频繁创建销毁太大会浪费内存。一个动态调整的池设置最大上限是较好的选择。3. 手把手实现一个基础UIS无限滚动列表理论说再多不如动手写一遍。我们来实现一个最简单的垂直列表无限滚动。3.1 创建数据与视图项首先定义数据模型和视图脚本。// ItemData.cs - 数据模型 [System.Serializable] public class ItemData { public int id; public string title; public string description; public Sprite icon; }// InfiniteScrollItem.cs - 视图项控制器 using UnityEngine; using UnityEngine.UI; public class InfiniteScrollItem : MonoBehaviour { public Text titleText; public Text descText; public Image iconImage; // 数据绑定方法 public void SetData(ItemData data) { if (data null) { // 可以隐藏或显示一个空状态 gameObject.SetActive(false); return; } gameObject.SetActive(true); titleText.text data.title; descText.text data.description; iconImage.sprite data.icon; } // 回收时调用清理状态 public void OnRecycle() { // 可以在这里停止动画、清理临时数据等 iconImage.sprite null; } }创建一个UI预制体挂载InfiniteScrollItem脚本并绑定好对应的UI元素。3.2 构建无限滚动控制器这是核心类我们称之为InfiniteScrollView。// InfiniteScrollView.cs using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; public class InfiniteScrollView : MonoBehaviour { [Header(References)] public ScrollRect scrollRect; // Unity自带的ScrollRect public RectTransform viewport; // 视口 public RectTransform content; // 内容区域 public InfiniteScrollItem itemPrefab; // 列表项预制体 [Header(Settings)] public float itemHeight 100f; // 每一项的固定高度 public int buffer 1; // 视口外的缓冲项数量 // 数据 private ListItemData m_dataList new ListItemData(); // 对象池 private QueueInfiniteScrollItem m_itemPool new QueueInfiniteScrollItem(); // 当前活跃的视图项 数据索引, 项实例 private Dictionaryint, InfiniteScrollItem m_activeItems new Dictionaryint, InfiniteScrollItem(); private float m_contentHeight 0; private int m_visibleItemCount 0; private Vector2 m_lastScrollPos; void Start() { if (scrollRect null) scrollRect GetComponentScrollRect(); if (viewport null) viewport scrollRect.viewport; if (content null) content scrollRect.content; scrollRect.onValueChanged.AddListener(OnScrollValueChanged); InitializePool(); } // 初始化对象池预创建一些实例 void InitializePool() { m_visibleItemCount Mathf.CeilToInt(viewport.rect.height / itemHeight) 2 * buffer; for (int i 0; i m_visibleItemCount; i) { var item Instantiate(itemPrefab, content); item.gameObject.SetActive(false); m_itemPool.Enqueue(item); } // 设置Content的初始高度根据数据量 UpdateContentSize(); } // 设置数据并刷新列表 public void SetData(ListItemData dataList) { m_dataList dataList; UpdateContentSize(); RefreshAllItems(); } // 更新Content的总高度 void UpdateContentSize() { m_contentHeight m_dataList.Count * itemHeight; content.sizeDelta new Vector2(content.sizeDelta.x, m_contentHeight); } // 滚动值变化时的回调 void OnScrollValueChanged(Vector2 normalizedPos) { // 简单的防抖避免一帧内多次刷新 if (Vector2.Distance(m_lastScrollPos, normalizedPos) 0.001f) return; m_lastScrollPos normalizedPos; RefreshVisibleItems(); } // 刷新所有可见项 void RefreshVisibleItems() { if (m_dataList.Count 0) return; // 1. 计算当前应该显示的索引范围 float scrollY content.anchoredPosition.y; // 注意anchoredPosition受Pivot影响 // 假设Content的Pivot是(0.5, 1)即顶部居中那么向下滚动时anchoredPosition.y为负 int startIndex Mathf.Max(0, Mathf.FloorToInt(scrollY / itemHeight) - buffer); int endIndex Mathf.Min(m_dataList.Count - 1, startIndex m_visibleItemCount - 1); // 2. 回收不再需要的项 Listint keysToRemove new Listint(); foreach (var kvp in m_activeItems) { if (kvp.Key startIndex || kvp.Key endIndex) { RecycleItem(kvp.Key, kvp.Value); keysToRemove.Add(kvp.Key); } } foreach (int key in keysToRemove) { m_activeItems.Remove(key); } // 3. 为需要显示的索引创建或复用项 for (int i startIndex; i endIndex; i) { if (!m_activeItems.ContainsKey(i)) { var item GetItemFromPool(); if (item ! null) { SetupItem(item, i); m_activeItems[i] item; } } } } // 首次设置数据或数据全量更新时调用 void RefreshAllItems() { // 回收所有活跃项 foreach (var kvp in m_activeItems) { RecycleItem(kvp.Key, kvp.Value); } m_activeItems.Clear(); // 刷新显示 RefreshVisibleItems(); } // 从对象池获取一个项 InfiniteScrollItem GetItemFromPool() { if (m_itemPool.Count 0) { return m_itemPool.Dequeue(); } // 池空了实例化一个新的应尽量避免发生 var item Instantiate(itemPrefab, content); item.gameObject.SetActive(false); return item; } // 设置项的数据和位置 void SetupItem(InfiniteScrollItem item, int dataIndex) { item.gameObject.SetActive(true); item.SetData(m_dataList[dataIndex]); // 计算并设置位置 float yPos -dataIndex * itemHeight; // 假设锚点在顶部 item.GetComponentRectTransform().anchoredPosition new Vector2(0, yPos); } // 回收项到对象池 void RecycleItem(int dataIndex, InfiniteScrollItem item) { item.OnRecycle(); item.gameObject.SetActive(false); m_itemPool.Enqueue(item); } }3.3 在场景中配置与测试在UI Canvas下创建一个带有ScrollRect的Panel作为滚动视图。将ScrollRect的Viewport和Content分别拖拽好。将InfiniteScrollView脚本挂载到ScrollRect的游戏对象上并在Inspector中关联好scrollRect、viewport、content和你的itemPrefab。设置itemHeight为你预制体的实际高度。编写一个测试脚本生成一批ItemData并调用InfiniteScrollView的SetData方法。运行游戏你应该能看到一个可以流畅滚动大量数据的列表并且在Profiler中观察无论数据多少存在的Item实例数量基本恒定。4. 性能优化与高级特性实现基础版本跑通了但要在生产环境使用我们还需要考虑更多。4.1 避免在滚动时进行昂贵操作OnScrollValueChanged每帧都可能被调用。因此在RefreshVisibleItems中避免在循环内进行Find、GetComponent所有引用都应在初始化时缓存。避免频繁的布局重建如果ItemView内部有LayoutGroup数据更新可能导致它重新计算布局。可以考虑使用ContentSizeFitter配合LayoutGroup但要注意性能。对于复杂布局手动计算尺寸可能更高效。使用协程分帧更新如果一次性需要刷新很多项如数据源巨变可以将更新操作分散到几帧中完成避免单帧卡顿。IEnumerator RefreshItemsGradually(int startIndex, int endIndex) { for(int i startIndex; i endIndex; i) { // 更新一项 if (m_activeItems.TryGetValue(i, out var item)) { item.SetData(m_dataList[i]); } // 每更新N项等待一帧 if ((i - startIndex) % 5 0) yield return null; } }4.2 支持可变高度与网格布局可变高度是无限滚动的“圣杯”但实现复杂。主流方案有两种预估修正先给一个预估高度项创建后根据实际内容计算真实高度然后调整该项位置并递归调整其后所有项的位置。这需要维护一个所有项累积高度的数组计算量较大。两阶段布局第一阶段创建所有项的“测量版本”可能是简化版或离线计算计算出所有项的真实尺寸并缓存。第二阶段基于缓存尺寸进行滚动和布局。这需要额外的计算开销但滚动时性能稳定。网格布局相对规则。你需要定义columnCount列数和cellSize单元格大小。计算起始索引时需要先根据滚动偏移算出起始行startRow Mathf.FloorToInt(scrollOffset / cellSize.y)然后startIndex startRow * columnCount。布局时项的位置由(row, col)决定pos.x col * cellSize.xpos.y -row * cellSize.y。4.3 与Addressable/AssetBundle资源管理结合在商业项目中Item的图标等资源通常通过Addressables或AssetBundle加载。这带来了异步加载的问题。为ItemView设置加载状态加载完成前显示占位图。处理快速滚动时的加载取消如果一项刚发起加载请求就滚出了屏幕应该取消这个加载请求避免无用加载和潜在的内存泄漏。Unity的Addressables提供了AsyncOperationHandle可以用于取消。实现简单的资源缓存已加载的Sprite可以缓存在一个字典里Key可以是资源的地址或ID避免同一资源被多次加载。// 在ItemView中 public void SetDataAsync(ItemData data) { // 显示占位符 iconImage.sprite placeholderSprite; // 取消上一次的加载如果存在 if (m_currentLoadHandle.IsValid()) { Addressables.Release(m_currentLoadHandle); } // 发起异步加载 m_currentLoadHandle Addressables.LoadAssetAsyncSprite(data.iconAddress); m_currentLoadHandle.Completed handle { if (handle.Status AsyncOperationStatus.Succeeded this ! null) { iconImage.sprite handle.Result; } // 可以在这里处理加载失败的情况 }; } void OnDestroy() { if (m_currentLoadHandle.IsValid()) Addressables.Release(m_currentLoadHandle); }5. 常见问题排查与实战心得在实际项目中使用自研的无限滚动列表你肯定会踩一些坑。下面是一些典型问题和我个人的解决经验。5.1 列表跳动或闪烁原因1布局计算在错误时机进行。Unity的UI布局系统LayoutGroup会在Canvas.WillRenderCanvases事件中更新这可能和你的滚动刷新逻辑冲突。如果你的ItemView依赖LayoutGroup自动排列在SetupItem设置位置后LayoutGroup可能会覆盖你的计算结果。解决对于无限滚动的项禁用其上的LayoutGroup完全由滚动控制器手动计算并设置anchoredPosition。Content上可以使用一个VerticalLayoutGroup来帮助确定初始布局但在运行时刷新时应确保其不影响子项位置。原因2滚动值变化事件触发过于频繁。OnScrollValueChanged每帧调用如果你的RefreshVisibleItems里有昂贵的操作会导致连续多帧刷新视觉上可能跳动。解决如之前所述加入防抖逻辑或者使用ScrollRect的movementType设置为Clamped或Elastic可以减少一些微小抖动。更根本的是优化RefreshVisibleItems内部的逻辑。5.2 滚动到底部或顶部时异常现象快速滚动到底部时最后几项不显示或者出现空白。排查检查索引计算确保endIndex的计算公式Mathf.Min(m_dataList.Count - 1, startIndex m_visibleItemCount - 1)正确。m_dataList.Count - 1是最大有效索引。检查Content高度UpdateContentSize是否正确计算了总高度m_dataList.Count * itemHeight。如果数据量很大确保没有整数溢出。检查视口和Content的锚点Pivot这是最容易出错的地方。我们的位置计算公式强烈依赖于锚点预设。一个稳定的做法是将Content的锚点Pivot设置为(0,1)左上角并将其Anchor的Min和Max也设置为(0,1)。这样坐标系就非常清晰原点在左上角Y轴向下为负。此时项的位置posY -index * itemHeight滚动偏移scrollY content.anchoredPosition.y向下滚动为负值。实操心得在项目初期就固定好一套锚点方案推荐左上角并为此编写对应的位置计算函数。不要混用不同的锚点预设那会是一场灾难。5.3 内存泄漏与对象池管理现象随着滚动内存持续增长或者项被回收后状态混乱。解决确保回收时状态重置RecycleItem中一定要调用项的OnRecycle方法清除对数据特别是Texture、Sprite等大资源的引用。管理好异步加载如上文所述取消未完成的加载请求。限制池大小虽然对象池是为了复用但也不能无限增长。可以设置一个最大池容量当回收的项超过这个数量时直接Destroy掉。void RecycleItem(...) { // ... 重置状态 ... if (m_itemPool.Count m_maxPoolSize) { m_itemPool.Enqueue(item); } else { Destroy(item.gameObject); } }在场景切换或列表销毁时清理在OnDestroy方法中遍历对象池和活跃项字典销毁所有游戏对象并释放所有托管资源如加载句柄。5.4 与输入事件如点击的交互无限滚动的项需要响应点击事件。由于项是复用的你需要小心处理事件监听和数据索引的关联。推荐做法在SetupItem方法中为项的按钮添加监听并在回调函数中传入当前的数据索引dataIndex。Button btn item.GetComponentButton(); if (btn ! null) { btn.onClick.RemoveAllListeners(); // 关键移除旧的监听防止复用导致重复触发 btn.onClick.AddListener(() OnItemClicked(dataIndex)); }避免在ItemView内部直接处理业务逻辑ItemView应该只负责显示和触发事件具体做什么如打开详情页、删除数据应该由更上层的管理器如滚动控制器或其委托来处理。这保持了代码的清晰和可测试性。实现一个稳定高效的无限滚动列表是Unity UI开发中的一项重要技能。从理解原理到亲手实现基础版本再到处理各种边界情况和性能优化这个过程会让你对Unity的UI系统、对象生命周期和性能优化有更深的理解。虽然市面上有很多优秀的插件如EnhancedScroller、Unity-UI-Extensions里的ListView等但掌握其核心原理能让你在使用这些插件时更加得心应手在遇到特殊需求时也能从容地定制或自研。记住关键永远是数据与视图分离、精确的对象池管理、以及严谨的坐标计算。当你把这些都理顺了无论面对多么复杂的长列表需求你都能找到清晰的解决路径。