背包列表：图集、滚动和列表复用
依据：Cocos Creator 3.8 ScrollView、UI 合批和资源管理文档。演示在浏览器运行，微信真机未验证。
目标画面
背包里每个格子有图标、品质边框、数量和选中态。简单版本可以一次创建所有格子，适合规模有限且验证后成本可接受的界面；复杂版本用少量可见格子承载更长的数据列表，加入筛选、排序、异步图标和拖拽。
列表复用的核心不是“隐藏看不见的物品”，而是将固定的一组界面槽位重新绑定到不同数据。滚动时根据偏移计算起始行，再更新每个槽位的数据与位置；内容总高度仍对应全部数据，滚动条才能表达完整范围。
三种数量要分别观察
物品数据可以有很多条，可见格子只有几行，实际创建节点还要考虑缓冲行。一个格子又可能包含多个绘制组件。实验里显示的节点或格子数量，不等于引擎 Draw Call；是否合批还依赖纹理、材质、顺序等条件。
打开背包列表实验台，增加物品总数，切换全部创建与复用，观察创建数量和当前可见范围。滚动到中间再改变数据，检查偏移是否仍有效。这个浏览器示例说明复用原理，不是 Cocos 的虚拟列表插件。
资源与交互怎样配合
图标使用统一视觉尺寸，按使用范围规划图集；数量文字与品质边框保持独立。异步请求图标时记录当前物品 ID，返回时再次检查槽位是否还绑定该 ID。否则快速滚动会把旧请求的结果贴到新物品上。
点按与滚动也需仲裁：超过移动阈值就取消点击，拖拽换位则进入独立手势状态。列表复用后，应重置选中、禁用、稀有光效和监听，避免上一个物品的状态残留。
常见失败：滚着滚着显示错数量
复用只更新图标，没有更新数量、品质或选中态；或监听闭包捕获旧索引。让绑定函数完整设置所有可变状态，让点击时读取当前绑定数据。排序后使用稳定物品 ID，而不是把可见下标当成业务身份。
交付检查
覆盖空列表、单行、最后一行不满、最大数量、快速滚动、加载失败、筛选后条数减少和窗口大小改变。更复杂的可变高度列表需要累计高度、定位和重排策略，不能直接照搬固定高度公式。成本测量结合 资源管理 与 性能边界。
官方来源与适用范围
资料核查日期：2026-10-30。文中的案例参数与图解用于教学；目标项目应按所用版本及平台重新验证。