翻译UX`pan`手势的策略，以设置无上限的线性值

Question

我正在尝试使用ionic2中的pan手势设置一个滑块（实际上是厨房计时器），请参见：http：//ionicframework.com/docs/docs/v2/components/umponents/#gestures

滑块/计时器具有一个可以通过panright设置的开放式上限，但在panleft上向下降至零。

如何最好地将pan事件转换为速度敏感的，以使上限接近36000，但敏感以设置为小至10的增量？最大deltaX大约为400px，但我想用户可以使用一些pan手势达到一个大价值。

我可以使用一些准备好的easing功能来实现这一目标吗？

Answer 1

只是抽象地思考：

您可以检测2个连续的PAN事件之间的幅度。如果它足够小，那么您可以允许较小的增量粒度。另一方面，如果您决定它足够大，则可以允许更大的增量。从理论上讲，您可以在PAN事件期间连续进行此检查，甚至可以动态地影响上限（尽管不确定为什么这是相关的）。

我不明白为什么您需要担心这种情况下的上限。你能解释一下吗？

Answer 2

使用Riron的注释，您只需将velocityX乘以deltaX即可。我在快速测试中看到，速度很容易获得高于8，低于1（例如0.5）。三角洲可以在数十个中或数百个中，因此允许两种必需的敏感性。这是一个代码：

hammerObj.on("panright panleft",
  function(ev){
      if(ev.type == "panright"){
          timer += ev.speedX * ev.deltaX; 
            //timer = Math.min(36000, ev.speedX*ev.deltaX+timer); for an upper bound of 36000 instead of unbound
      } else if (ev.type == "panleft"){
          timer = Math.max(0, timer - (ev.speedX * ev.deltaX));
      }
    }