Swipe problem on Android #823

Open
Easyone opened this Issue Oct 2, 2013 · 18 comments

Projects

None yet
@Easyone
Easyone commented Oct 2, 2013

Since * SHA 8834945, I can't get 'swipeLeft' and 'swipeRight' to work correctly on Android devices. I use a Nexus 7 2013 (Android 4.3), a Galaxy Tab 10.1 (Android 4.0.4) and a Galaxy S (Android 4.2).
Some tests I ran:

  • Android default browser: doesn't work
  • Google Chrome: doesn't work
  • Mozilla Firefox: works perfectly
  • Opera for Android: doesn't work

Same problem with the example touch_events.html file shipped with zepto. I'm not much of a developer so I may have done something wrong, but everything works fine with # SHA 488e773.

@miketaylr

Would you be able to link to a minimal test case? That would be super helpful in diagnosing.

@madrobby madrobby was assigned Nov 24, 2013
@ellison13tj

I also can't get all about 'swipe' to work correctly on Android devices. I use a Nexus 4 ,xiaomi 1S 。

@mark-bradshaw mark-bradshaw referenced this issue in soyjavi/QuoJS Dec 17, 2013
Closed

Android 4.4 seems to break swiping. #101

@mark-bradshaw

I'm not sure if this is exactly what the original person was seeing, but here's a simple codepen example that demonstrates the problem for me.

http://cdpn.io/lHJzI

You can edit the pen to see what's going on, but it's stupid simple. You should be able to swipe left or right that red box and get an alert that says "swipe". This works fine on IOS, but does nothing on my Nexus 4 with 4.4 installed.

@mark-bradshaw mark-bradshaw referenced this issue in jquery/jquery-mobile Dec 17, 2013
Closed

Swipe broken on Android 4.4 #6805

@wmartins

Same problem here @mbradshawabs . Very strange. Also, I've tested in Android 4.2.2 (Samsung Galaxy S II) and the same problem occurs.

@wmartins

Hey guys, I've found some interesting topic about the problem here: https://code.google.com/p/android/issues/detail?id=19827

So, I added e.preventDefault() to the line 92 (inside 'touchmove' event handler) on the file touch.js and everything worked fine...

Can you test this?

@lukemorton

I can confirm I have this problem with Nexus 5 Chrome and the e.preventDefault() in touch.js:92 fixes the problem.

@mark-bradshaw

I had this problem primarily in another library I use, that functions very similarly. I didn't test the proposed solution in zepto, but I did implement a similar patch in the other library with success.

@lukemorton

This e.preventDefault() also stops a div from scrolling for me.

@mark-bradshaw

I think the final solution will need to be a bit more than just e.preventDefault. If you read the original thread linked to by wmartins, you'll find a bit more sophisticated approach that at least shows the path to a work-around for this google bug.

@husa
husa commented Feb 20, 2014

Yeah, I can confirm this problem on Nexus 7 2012, Nexus 7 2013, Nexus 4, Moto G, SGS4 and few others. Thats because android is not firing "touchend" event, only first "touchmove" is fired, if you do nothing, android thinks that you're trying to scroll and prevents any further events from firing.
As for me, I was interested only in horizontal swipes(left/right), so I added
if (deltaX > 30) e.preventDefault()
in "touchmove" listener, so if horizontal distance between "touchstart" and first "touchmove" is more than 30px than it's supposed to be swipe.
But this solution will not work for "slow" swipes and so on.

@danielfbm

I am also having the same issue, mostly with Android 4.4 in the WebView (Cordova App).
Is anyone going to fix this in Zepto?
Thanks

@mdelapenya mdelapenya added a commit to mdelapenya/miriada-x-firefox-os that referenced this issue Apr 14, 2014
@mdelapenya mdelapenya [opcional 6.2] Definir un cronómetro que responda a los eventos tap y…
… swipe de zepto. OJO que no funciona el swipe con ciertos teléfonos Android (madrobby/zepto#823)
767c656
@TNT-RoX
TNT-RoX commented May 27, 2014

There are two different issues here the first is due to different pixel densities.
The second issue is on kitkat only and is caused by kitkat firing a cancel instead of a end event.
Here is the fix: UPDATED


.on('touchcancel touchend MSPointerUp pointerup', function(e){
var swipelength;
    if((_isPointerType = isPointerEventType(e, 'up')) &&
        !isPrimaryTouch(e)) return
    cancelLongTap()
    swipelength = Math.round(30 / window.devicePixelRatio);
    if ((touch.x2 && Math.abs(touch.x1 - touch.x2) > swipelength) ||
        (touch.y2 && Math.abs(touch.y1 - touch.y2) > swipelength))

http://developer.android.com/guide/webapps/migrating.html#TouchCancel

@songhlc
songhlc commented May 30, 2014

it worked fine use your method.thanks
wmartins commented on 2013年12月20日
Hey guys, I've found some interesting topic about the problem here: https://code.google.com/p/android/issues/detail?id=19827

So, I added e.preventDefault() to the line 92 (inside 'touchmove' event handler) on the file touch.js and everything worked fine...

Can you test this?

@TNT-RoX
TNT-RoX commented May 30, 2014

For better scaling try : swipelength = Math.round(30 / window.devicePixelRatio);

@TNT-RoX
TNT-RoX commented Jul 1, 2014

I have created a proof-of-concept shim to overcome this Android bug. https://github.com/TNT-RoX/android-swipe-shim

@ralfhauser

I have the same problem with an iPad.

Is https://github.com/madrobby/zepto/blob/master/examples/touch_events.html deployed anywhere publicly accessible for tests?

@madrobby
Owner

Hi there, does anybody in here have a PR w/ tests that we can apply?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment