使用jQuery确定Android取消/返回滑动(从左向右滑动)

在Android上,不使用像Sencha或JQTouch或JQMobile这样的框架,而是使用jQuery(常规jQuery),我想检测取消/后退(从左到右滑动)。 到目前为止,我已经完成了一些工作,但我正在尝试确定在jQuery中实现的数学公式,以便捕获从左到右的滑动事件,而不是另一种手势。 你有什么建议? 我想我需要某种可接受的差异。 我假设某种微积分公式可以在这里重新应用,但不幸的是我在大学里避开微积分。 所以,你的答案将教育我,希望如此。

以下是一些示例x,y开始/结束数据:

(a)从中间左上角向右上方滑动(在这种情况下是不合需要的手势)

21,269 – 278,85

(b)从中间左侧到右下角斜向滑动(在这种情况下是不合需要的手势)

13,269 – 331,436

(c)从中间左侧向右中间直线(一种)(一种理想的手势)

34,267 – 326,266

要么

36,494 – 355,479

var gnStartX = 0; var gnStartY = 0; var gnEndX = 0; var gnEndY = 0; window.addEventListener('touchstart',function(event) { gnStartX = event.touches[0].pageX; gnStartY = event.touches[0].pageY; },false); window.addEventListener('touchmove',function(event) { gnEndX = event.touches[0].pageX; gnEndY = event.touches[0].pageY; },false); window.addEventListener('touchend',function(event) { alert('START (' + gnStartX + ', ' + gnStartY + ') END (' + gnEndX + ', ' + gnEndY + ')'); },false); 

我通过反复试验发现这可能是多么简单,没有必要的微积分。 以毫秒为单位的时间必须相当快,因此不超过350毫秒。 Y方差应为+40或-40。 距离应为240像素。

但请注意,我在代码中使用此META标记有关与设备无关的像素:

  

以及我处理后退/取消滑动事件的方式:

 var gnStartX = 0; var gnStartY = 0; var gnStartTime = 0; var gnEndX = 0; var gnEndY = 0; var gnEndTime = 0; window.addEventListener('touchstart',function(event) { gnStartX = event.touches[0].pageX; gnStartY = event.touches[0].pageY; gnStartTime = Number(new Date()); },false); window.addEventListener('touchmove',function(event) { gnEndX = event.touches[0].pageX; gnEndY = event.touches[0].pageY; gnEndTime = Number(new Date()); },false); window.addEventListener('touchend',function(event) { var nDiffTime = gnEndTime - gnStartTime; var nDiffX = gnEndX - gnStartX; var nDiffY = gnEndY - gnStartY; // is this a swipe back/cancel event? if ((nDiffTime <= 350) && (nDiffX >= 240) && (nDiffY >= -40) && (nDiffY <= 40)) { event.preventDefault(); goBack(); } },false); 

一个人只需要用它来实现自己的goBack()函数。

滑动意图的一个可能很好的指标可能是滑动线的斜率:

 var nDiffX = gnEndX - gnStartX; var nDiffY = gnEndY - gnStartY; var nSlope = nDiffY / Math.max(0.001,nDiffX); if ((nDiffTime <= 350) && (Math.abs(nDiffX) >= 240)) { event.preventDefault(); if ((nSlope > -0.125)&&(nSlope < 0.125)) { // Between lines of 1/8 and -1/8 slope - close enough to straight horizontal if (nDiffX > 0) { // Swiped to the right } else { // Swiped to the left } } goBack(); } 

同样,您可以检查斜率是否接近1表示右上或左下滑动,-1表示上左或右下。