Ionic 4 swipe to go back gestures?

Ionic Framework ionic-v3
1

Hello everyone,

I was wondering if my application is broken or if swiping on pages to go back has been disabled in Ionic 4? Or perhaps a better question - has this ever existed in Ionic?

If swiping gestures don’t come with Ionic, are there any good, angular-ready packages I can use in my project to enable for this functionality? I currently have pages where I need to swipe to go back on and more importantly a modal that I’d like to be able to swipe down on to dismiss it.

Any help or recommendations would be much appreciated.

2

Oops!
Yes, that once existed, and existed in another version of Ionic 4.
I also have this doubt, it is not working for me now.
But I’m sure one day it worked, today opens the drawer menu.

3

Hi, you can handle the swipe with this attribute:

<ion-router-outlet swipeGesture="false"></ion-router-outlet>
4

Thank you! Much appreciated

5

Hi, I redently read this again and I found a solution for close a modal with swipe down gesture. Here is and example:

1) npm install hammerjs — save add this to main.ts file: import 'hammerjs';

2) add this to app.module.ts:

// classic import sintax

import { HammerGestureConfig, HAMMER_GESTURE_CONFIG } from '@angular/platform-browser';

// class for hammer config

export class MyHammerConfig extends HammerGestureConfig  {

  overrides = <any>{

      // override hammerjs default configuration

      'swipe': { direction: Hammer.DIRECTION_ALL  }

  }

}

…

// then in providers array:

providers: [

    StatusBar,

    SplashScreen,

    { 

      provide: HAMMER_GESTURE_CONFIG, 

      useClass: MyHammerConfig 

    },


  ],

3) the html:

<div class="modal-main">

  <div class="modal-header" (swipedown)="swiped()" >

  <div>

</div>

4) Finally the ts file:

    swiped() {

       // method for close your modal
       this.dismissModal(); 

    }

5) If you have any question, please tell me! :grinning:

2 Likes