ScrollView分页工作原理及自定义分页尺寸配置方法

系统原生pagingEnabled开启后，分页步长完全等于ScrollView自身的bounds尺寸，和内部子元素大小、排布间距没有关联：横向滚动时分页步长为ScrollView自身宽度，纵向滚动时为ScrollView自身高度，滚动停止位置永远是「步长 × 整数」的坐标点，和官方文档描述的规则一致。

你需要的每次滚动刚好停靠到下一组5个元素位置的效果，可根据业务场景选两种实现路径：

• 方案1：适配原生分页逻辑（实现成本最低）
  将外层承载滚动的ScrollView的宽度，直接设置为「单个元素宽度 × 5 + 页内元素总间距 + 单页内边距」，也就是刚好等于你期望的单页可视区域宽度。此时开启pagingEnabled后，系统会自动按这个宽度做整数倍停靠，内部正常按固定宽高、统一间距排布15个元素即可，不需要额外计算滚动位置。
• 方案2：自定义分页步长（适配特殊视觉场景）
  如果你的ScrollView本身宽度大于5个元素总宽度（比如需要在当前页边缘露出相邻页的元素预览），不要开启系统自带的pagingEnabled。通过实现ScrollView的滚动代理方法，在用户结束拖拽时计算距离当前滚动位置最近的「5个元素总宽度（含间距）」整数倍坐标，主动调用滚动接口停靠到对应位置即可，这种方式的分页步长完全自定义，不受ScrollView自身尺寸限制。

注意：计算单页步长时必须把元素间距、内容内边距一并算入总宽度，否则多次滚动后会出现位置累计偏移。

基于原生pagingEnabled实现的必配项 #

• 必须设置pagingEnabled = true，开启系统原生分页停靠逻辑
• 必须正确设置contentSize：横向滚动场景下contentSize.width等于15个元素+所有间距/内边距的总宽度，contentSize.height与ScrollView自身高度保持一致
• ScrollView自身宽度必须严格等于你设定的单页分页步长，否则停靠位置会不符合预期
• 建议关闭对应方向的滚动指示器（showsHorizontalScrollIndicator = false/showsVerticalScrollIndicator = false），避免分页滚动时指示器跳动异常

基于自定义代理实现分页的必配项 #

• 不需要开启pagingEnabled，但必须正确设置contentSize和内部元素排布约束，保证滚动范围准确
• 必须实现scrollViewWillEndDragging:withVelocity:targetContentOffset:代理方法，在方法内重写目标偏移量，对齐到自定义分页步长的整数倍位置
• 建议将decelerationRate设置为快速衰减模式，滚动手感和原生分页效果保持一致

内容的提问来源于stack exchange，提问作者lch