由一个浏览器插件引起的手势探讨

有一天，在v2ex看帖，回复里有人提到了whatruns这个浏览器插件，就是用来查看某个网站采用的技术。

好奇之下，我安装了这个插件，whatruns显示pwa版微博用到了hammer.js，这是一个开源库，旨在为网站提供各种触控手势感应，而且不需要安装其他依赖。以后开发移动端网站，提升用户体验方面可能会用到。

而在Getting Started里，有一段初始化代码，

    var hammertime = new Hammer(myElement, myOptions);
    hammertime.on('pan', function(ev) {
        console.log(ev);
    })

pan是什么意思，我只知道pan是平底锅，而国内网盘网站都喜欢在域名里加上pan，这样大家一看就知道是个网盘网站。谷歌给出的答案则引用了苹果开发者网站提供的文档里的解释，

A pan gesture occurs any time the user moves one or more fingers around the screen. A screen-edge pan gesture is a specialized pan gesture that originates from the edge of the screen.

大意就是当你的一根或多根手指在屏幕上移动时，就触发了pan这个手势，但我还是不太明白。于是查词典，终于找到一个动词解释:

- v.
 1. make a sweeping movement
 "The camera panned across the room"

这特么不就是在屏幕上滑动嘛，please speak English（请说人话）！有时一个词过度解释反而让人摸不着头脑，比如有人说脱氧核糖核酸可以用来做亲子鉴定，你可能反应不过来，但是说DNA你就明白了，然而你并不知道DNA到底是什么。

这里在延伸一下，除了我知道的tap(点按)、swipe(滑动)，double tap(双击,类似pc端的dbclick)，还有pinch(缩小)和stretch(放大)。

说到这里，我又产生了一个疑问，虽然我把pan理解为swipe，实际上它们并非完全一样，于是我在stackoverflow里找到了一个200多赞同的答案：

By definition, a swipe gesture is necessarily also a pan gesture -- both involve translational movement of touch points. The difference is in the recognizer semantics: a pan recognizer looks for the beginning of translational movement and continues to report movement in any direction over time, while a swipe recognizer makes an instantaneous decision as to whether the user's touches moved linearly in the required direction.

简单来说，swipe手势自然也是pan手势，区别在于，pan手势感应器记录手指在屏幕上平移的初始点，并且在往任何方向的移动过程中不断记录动向，而swipe手势更专注于用户的手指是否往指定方向移动，比如上滑、左滑。像用户交互中的左滑删除肯定是swipe手势。