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

有一天,在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,实际上它们并非完全一样,于是我在*里找到了一个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手势。

上一篇:A. A Twisty Movement dp


下一篇:Uber面对都市的复杂交通战推移动速度数据服务