实现动态滚动的算法

Question

创建动态滚动实现的一些好算法是什么？该功能将在自定义UI列表上进行测试。虽然我的目标是移动设备（那些没有内置此功能的设备），但来自不同编程领域的任何算法或代码示例也可能适合。

Answer 1

我最近自己实施了一个。这些是我采取的步骤。

1. 您需要测量光标的速度（鼠标光标或手指）
2. 实现一个简单的粒子物理循环。有关如何执行此操作的信息可以在here
找到
3. 使用从滚动平面宽度和视口宽度得出的数学给出粒子“边界”
4. 连续地将鼠标速度和粒子速度之间的差异添加到粒子的速度，因此粒子的速度“匹配”鼠标的速度，只要它移动。
5. 用户抬起手指后立即停止执行步骤4。物理循环处理惯性。
6. 添加您的个人兴趣，例如“保险杠”边距，以及平滑滚动“锚点”，这些点在zeno的悖论上运作以计算运动。
7. 我差点忘了：从上面得到坐标，并将其用作滚动平面的位置。

我很快就会开源代码。你多久需要这个？

编辑：更改了链接。对不起，指向略有错误的页面。 edit2：不是吗？无论如何，我链接到的原始页面是当前链接页面上的第一个链接。

Answer 2

由于这是最初被问到的，我已经仔细阅读了pastrykit的源代码，这是一个框架，其中apple完全复制了他们在javascript中的动态滚动。没有粒子物理循环 - 触摸的速度是在手指抬起的确切时刻测量的。从那时起，使用简单的缓动函数对滚动进行动画处理，该函数使用velocity作为输入参数。

Answer 3

我刚刚在我的移动GUI框架中添加了一个滚动小部件，所以我想我会在这里分享我的解决方案。

由于这是一个非常复杂的问题，我决定把它分成更小的独立子任务，如下所示：

1. 基本滚动功能：此任务包括以最简单的方式处理拖动事件，即通过拖动距离和方向滚动内容。这是相对简单的实现，唯一棘手的方面是知道何时开始拖动操作与何时将tap事件传递给可滚动区域内的子窗口小部件。

2. 滚动惯性：这个是最具挑战性的。这里的想法是，在用户抬起手指后，滚动应该持续一段时间，减速直到它完全停止。为此，我需要了解滚动速度。不幸的是，从单个样本计算速度是不准确的，因此当用户滚动时，我在循环缓冲区中记录最后N个运动事件，以及每个事件发生的时间。我发现N = 4可以在iPhone和HP TouchPad上正常工作。当手指抬起时，我可以根据记录的动作计算惯性滚动的近似起始速度。我定义了一个负加速度系数，并使用标准运动公式（参见here）让滚动效果很好。如果滚动位置在仍然处于运动状态时到达边界，我只需将速度重置为0以防止其超出范围（接下来将解决突然停止）。

3. 灵活滚动限制：当滚动到达结尾时，我不想进入突然停止，而是希望小部件滚动一些，但提供阻力。为此，我将两端允许的滚动范围扩展了我定义为小部件维度的函数。我发现每端增加一半的宽度或高度都很好。让滚动感觉它提供一些阻力的技巧是当它们超出范围时调整显示的滚动位置。为此我使用了缩小加减速函数（有一些好的缓动函数here）。

4. 弹簧行为：既然现在可以滚动超出有效范围，我需要一种方法将滚动条带回有效位置，如果用户将其拉出范围。这是通过在卷轴停止在超出范围位置时调整滚动偏移来实现的。我发现调整功能给出了一个漂亮的弹性外观，是将当前位置到所需位置的距离除以常数并将偏移量移动该量。慢动作的常数越大。

5. 滚动条：最后一步是添加叠加滚动条，滚动开始时淡入淡出，结束时淡出淡出。

Answer 4

你看过Robert Penner的缓和功能吗？

http://www.robertpenner.com/easing/

IIRC这些最初是针对Actionscript的，已经存在了很长时间。

Answer 5

嗯，我认为它会像a）获得用户滚动速度的速度b）当他离开他的手指时，自动滚动列表，但速度随着用户的初始速度而降低。