【界面UI】ScrollView 滚动列表：锚点、回弹与可视区裁剪

实战应用：用在哪里

排行榜、背包、邮件列表都用 ScrollView 承载。滚动列表的三个常见问题：内容从底部开始（锚点设置错）、滚到边界生硬停止（无回弹）、条目太多滚动卡顿（无裁剪）。前篇的虚拟化列表解决“数据量大”，本篇解决“容器本身的参数与手感”。

三个参数的设置

local scroll = GUI:ScrollView_Create(parent, "rankScroll", 40, 60, 620, 480)
scroll:setDirection(cc.SCROLLVIEW_DIRECTION_VERTICAL)
scroll:setInnerContainerSize(620, contentHeight)     -- 内容实际高度
scroll:setBounceEnabled(true)                        -- 边界回弹
scroll:setTouchEnabled(true)
-- 内容节点锚点设为 (0, 1)，第一行摆在内容器顶部，向下排布

内容高度 = 行高 × 条目数，innerContainerSize 必须与实际内容一致，否则滚动范围错误。锚点 (0,1) 加从顶部排布，是列表类界面的标准布局。

回弹与边界

BounceEnabled 提供边缘回弹，回弹的视觉提示让玩家确认“已到尽头”。回弹期间触摸事件仍由 ScrollView 处理，业务层不需要干预；需要禁用回弹的场景（分页式界面）另用翻页容器。

滚动事件的业务挂钩

滚动回调里做三件事：按可视范围刷新虚拟化列表（配合列表虚拟化篇）；滚动到底部触发加载更多（分页拉取，避免一次性拉全量）；滚动方向变化时收起悬浮按钮（减少遮挡）。回调频率做节流（每 50ms 一次），滚动流畅度与业务刷新兼顾。三件配置完成后，同一个 ScrollView 基类可以承载排行榜、邮件、背包三种列表，差异只在条目渲染函数——容器与内容分离后，新列表界面的开发只剩一个渲染函数。

滚动事件的业务挂钩三件事的推荐实现：触底加载用 contentOffset 与内容高度的差值判断，阈值设一个行高；滚动方向变化用于收起悬浮按钮（向上滚隐藏、向下滚恢复）；惯性滚动期间跳过高耗刷新，滚动停止事件里再做一次精确刷新。三个钩子都做节流，滚动帧率就不会被业务逻辑拖累。

本文由 996 技术组基于 996 引擎官方知识库与浮生梦老师课程体系整理。团队长期从事传奇类引擎 Lua 后端逻辑、客户端界面与商业版本交付，内容以官方知识库与真实项目为出处，按版本持续修订。