Gesture Ionic 4

Ionic Framework
1

Hello,

First of all, I think you need to add a category for ionic-v4 for the forum.

Secondly, we are working on to migrate Ionic 3 app into Ionic 4. We use (tap) in Ionic 3. In Ionic 4, it doesn’t work and also, I don’t see gesture under components in Ionic 4 documentation. Will gestures be included in Ionic 4? Or do we need to replace all (tap) with (click)?

Ionic:
   ionic (Ionic CLI)          : 4.1.0 (/Users/userName/.nvm/versions/node/v8.11.4/lib/node_modules/ionic)
   Ionic Framework            : @ionic/angular 4.0.0-beta.3
   @angular-devkit/core       : 0.7.4
   @angular-devkit/schematics : 0.7.4
   @angular/cli               : 6.1.4
   @ionic/ng-toolkit          : 1.0.6
   @ionic/schematics-angular  : 1.0.5

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.2, cordova-plugin-ionic-webview 2.0.3, (and 13 other plugins)

System:

   Android SDK Tools : 26.1.1
   ios-deploy        : 2.0.0
   ios-sim           : 7.0.0
   NodeJS            : v8.11.4 (/Users/userName/.nvm/versions/node/v8.11.4/bin/node)
   npm               : 5.6.0
   OS                : macOS High Sierra
   Xcode             : Xcode 9.4.1 Build version 9F2000

Environment:

   ANDROID_HOME : /Users/userName/Library/Android/sdk/

Thank you!

Sincerely,
Ankeeta

1 Like
2

Gesture is present in Core. Maybe just not documented yet

Ionic is the designated category for latest Ionic release (4). Somewhere published by moderator in this forum

3

I was able to get it working by using

import { GestureController } from ‘@ionic/core/dist/collection/utils/gesture/gesture-controller’;

and instead of new Gesture(element);
use new GestureController(element);

1 Like
4

Below is the html I have for the tap event

<ion-button (tap)="processCameraOption()">
  {{ buttonText }}
</ion-button>

I saw the following warning on the console
The “tap” event cannot be bound because Hammer.JS is not loaded and no custom loader has been specified.

5

@ankeetas I replaced all “(tap)” with “tappable (click)”

6

Thank you @lancevo! I will try that.

7

Can you give a usage example with GestureController? Like, when we want to capture “pan” or something else?

8

@gravityaddiction Can you please share a example. This would be very great. thx a lot

9

1.npm install hammerjs --save

10

1.npm install hammerjs --save

11

Blazing fast click event can be achieved with

<ion-button (touchstart)="startTime()">

12

HI RIchard
Are you using hammerjs or ionic 5 gestures with touchstart? do you have any other configuration setup advice to get this working? thank you for any help.