滚动条位置与实际数据量的映射需保持准确
别名: 滚动条比例 · 虚拟列表高度 · 滚动位置谎言 · scrollbar thumb
概念解释
滚动条的滑块位置和长度是「这份内容有多长、我在哪里」的外部刻度。虚拟列表用估算高度撑开可滚范围,估算一偏,滑块就会说谎:看起来在中部,实际还在前 10%;看起来快到底,后面其实还有一半。滚动条与数据的映射(scrollbar-to-data mapping)要求刻度按真实条数和真实行高来,而不是按当前窗口里碰巧量过的那几行。
机制
滑块长度表示视口占全体的比例,滑块位置表示已经走过的比例。这两个比例的分母是全体高度。虚拟化常常用「已见面行的平均高度 × 总行数」当全体高度。平均若来自前几屏偏短的行,全体被低估,滑块偏长、位置偏后,人以为内容不多、自己已经很深。后面出现更高的行,全体高度在滚动中被修正,滑块会跳,位置感被当场撕掉。反向也成立:前面都是高行,后面都是矮行,会显得永远滚不完。映射必须尽量用真实行高;做不到就用稳定的估计,并避免在滚动中途大幅改分母。无限加载会让分母边滚边涨,滑块不断缩短,那是另一份「没有终点」的谎言,和窗口渲染要分开看。
怎么研究
构造前短后长、前长后短、行高一致三份虚拟列表,让人用滚动条跳到「大概一半」和「接近末尾」。记录实际到达的行号比例、滑块在跳转中是否跳动。自变量:高度策略(固定 / 平均估算 / 精确)。因变量:位置误差、跳动次数、误判剩余量。估算策略在行高变化大时应误差最大。
边界
行高完全固定时,映射可以精确,这条几乎不发作。滚动条被系统隐藏的触屏上,刻度本就弱,错误映射更难被发现,但点轨道跳转仍会打到错误的数据位置。辅助技术的「值」若暴露为像素而不是行号,读屏用户会听到一段无意义的高度,应改报「第 n 条,共 N 条」。
怎么落地
- 行高固定就按行数 × 行高做全体高度,不要用采样平均。
- 可变行高尽量测量过的用真值,未测量的用保守估计,禁止在一次滚动里大幅改已滚过的那一段的高度。
- 用滚动条跳转时按行号对齐窗口,而不是只设一个估算像素。
- 验证:把滑块拖到视觉中点,看实际行号是不是全集的一半。差出一个数量级,映射就在说谎。