[SOLVED] Swipe event freeze scroll on iOS and Android


#1

Hi,

I’m trying to upgrade to Ionic 3 and I’m facing a problem on iOS and android.

After the upgrade, I noticed that my ion-scroll is frozen (not scrollable) when it contains a swipe event.

Maybe it was luck but till Ionic 2.3.0, before upgrade, the scroll was fine, was scrollable, alright.

After upgrade, if I remove the event everything is working fine. I also created a minimal starter app where I tried to reproduce the problem, without any success, therefore I don’t think that the bug is on the Ionic side but mine.

Anyone faced that kind of problem? How did you solved it? Or anyone may have an idea/tips where I should have a look? I’m kind of slowly becoming insane about that bug

Thx a lot for any help

<ion-scroll #datePickerScrollY scrollY="true" id="datePickerScrollY">
    <ion-list no-padding (swipe)="swipeSomething($event)"> <!-- There, the swipe on the list or on the ion-scroll freeze my scroll -->
        <ion-item *ngFor="let hero of heroes" tappable (click)="whatever()">
         <p>{{hero.name}}</p>
     </ion-item>
  </ion-list>
</ion-scroll>

#2

Might be related to: https://github.com/driftyco/ionic/issues/11112


#3

That bug is making I’ve to say slowly crazy … anyone have got an idea for a workaround other than removing the swipe event?


#4

Look like the SwingModule (angular2-swing) is the reason for my frozen list with event (swipe). As soon as I remove the module, then my lists are scrollable again.

Why? No ideas


#5

Opened an issue, cause I’ve got no idea how to fix it, in the angular2-swing project

Also if someone want to have fun, here a sample project to reproduce the problem

https://github.com/peterpeterparker/myIonScroll.git


#6

The lib is probably blocking any gestures/touch events that happen.
Haven’t tried it myself, but a quick guess could be that.


#7

Thx, agree with you. Probably due to some evolution of Ionic 2.3 -> 3 this lib is blocking the gestures/touch events that happen on a device (tried many times, it’s still working while debugging in safari and chrome).


#8

Another option could be to look at the market

Simple to reskin to fit your needs.


#9

Thx for trying to find an alternative.

Look like, according the description of Ionic-2-tinder-cards, that he based his implementation on the same tutorial as I did which use the same lib angular2-swing


#10

angular2-swing is using swing which is using hammerjs. My feeling is that that last library is blocking the gestures. Someone recently opened an issue going in that direction.

Also I should check why everything is loaded when I only import the module. Except that, in my demo app, I don’t use the components of the libs itself, therefore I’m asking my self why it applies on the all app.


#11

Yep, in swing, following require is the source of the problem

var _hammerjs = require('hammerjs');

var _hammerjs2 = _interopRequireDefault(_hammerjs);

#12

After another couple of hours I finally come to the conclusion that maybe the best solution was to create a fork of these libraries to avoid the use of an external hammerjs reference where Ionic already embed is own version of hammer.

Doing so I created https://github.com/peterpeterparker/ionic-swing which seems to solve my issue according my test.

@mhartington may ask you, does that sound spontaneous totally silly or not? If not, then hooray, I’ll consider my issue as solve, I gonna be able to upgrade to Ionic 3 and of course I gonna share that forked project with the community…if silly then the beer gonna have different taste :wink:


#13

Freak, this story has freaking no end.

chrome: ok
iOS: ok now after my investment
android: ko

Opened an issue in the Ionic GitHub since I could reproduce the problem with a simple code and no foreign libs


#14

My issue seems to finally being solved on both iOS and Android.

Don’t know exactly why, I updated app-scripts today and removed/reinstalled all the dependencies. Also update cordova, most probably one of these operations solve my issue, that’s cool, I finally could update to Ionic 3 and close that issue :slight_smile:

For the fork of the swappable cars I created, follow following link: