触屏事件研究 - Githubissues

触屏事件

android

ios

Tapping (any number of taps)
Pinching in and out (for zooming a view)
Panning or dragging
Swiping (in any direction)
Rotating (fingers moving in opposite directions)
Long press (also known as “touch and hold”)

wp

Windows Phone Gesture

注: windows phone的触屏事件名称比较奇葩

Hammer.js

Hammer Gestures

hold
tap
doubletap
drag, dragstart, dragend, dragup, dragdown, dragleft, dragright
swipe, swipeup, swipedown, swipeleft, swiperight
transform, transformstart, transformend
rotate
pinch, pinchin, pinchout
touch (gesture detection starts)
release (gesture detection ends)

其他参考资料

通用触屏事件

可以看到通用的触屏事件至少包括:

滑动(swipe), 方向上下左右
捏(pinch), 常用于放大(zoom in)缩小(zoom out)视图
旋转(rotate), 常用于旋转视图
拖拽(drag)
长按(hold), android和ios都叫long press, 感觉叫hold更形象

点击稍复杂:

android称为touch, 双击是double touch
ios, wp和hammer称为tap, hammer可参考其源码注释
touch这个事件本身分为touchstart/end/move/cancel, 参见spec
少数服从多数, 就叫tap

通用触屏事件列表

注: 下表给出是触屏事件中的元事件, 组合事件如: hold+swipe在Android上用在移动桌面图片; 由于组合事件众多, 不一一列出

事件类别	事件描述	简称	别称
tap(这个avalon使用fastclick技术)	移动平台默认浏览器的click事件有300ms+的延时, 通常使用touch事件模拟, 为区别点击称为拍击: `tap(avalon使用click)` 拍击 `doubletap(avalon使用doubleclick)` 双击 `hold` 长按 `tapn` n(2,3..)指拍击	拍击	android: touch hold称呼较多: android/ios: long press wp: tap and hold 也有称为press
swipe	按方向细分为: `swipe` 单指滑动 `swipeleft` 单指向左滑动 `swiperight` 单指向右滑动 `swipeup` 单指向上滑动 `swipedown` 单指向下滑动 `swipen` n(2,3..)指滑动	滑动	wp: flick
drag	`drag` 拖拽 `dragstart` 拖拽开始 `dragend` 拖拽结束 `dragup` 向上拖拽 `dragdown` 向下拖拽 `dragleft` 向左拖拽 `dragright` 向右拖拽	拖拽	ios/wp: pan
pinch	常用于放大(zoom in)缩小(zoom out)视图: `pinchin` 双指捏合 `pinchout` 双指展开 `squeeze` 五指捏合 `splay` 五指展开	捏	android: pinch open/close pinchout也有称为spread
rotate	常用于旋转视图 `rotatecw` 顺时针旋转 `rotateccw` 逆时针旋转	旋转
shake	常用于游戏中控制方向, 细分为: `shake` 移动设备 `shakeup` 向上移动设备 `shakedown` 向下移动设备 `shakeleft` 向左移动设备 `shakeright` 向右移动设备 `shakeforward` 向前移动设备 `shakeback` 向后移动设备 `shakeleftright` 左右移动设备 `shakeforwardback` 前后移动设备 `shakeupdown` 上下移动设备 http://www.guokr.com/question/379891/ https://github.com/alexgibson/shake.js	重力感应

RubyLouvre / avalon

触屏事件研究 #534

触屏事件

android

ios

wp

Hammer.js

其他参考资料

通用触屏事件

通用触屏事件列表