mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-22 21:48:42 +08:00
fix(gestures): fixes scroll issue with hammer config
Fixes scroll issue with hammer config where pinch/rotate gestures are preventing the screen from scrolling. Closes #6897
This commit is contained in:

committed by
Adam Bradley

parent
4e3bcb98a5
commit
174efc196d
@ -1,6 +1,7 @@
|
|||||||
import { enableProdMode, PLATFORM_DIRECTIVES, provide } from '@angular/core';
|
import { enableProdMode, PLATFORM_DIRECTIVES, provide } from '@angular/core';
|
||||||
import { disableDeprecatedForms, provideForms } from '@angular/forms';
|
import { disableDeprecatedForms, provideForms } from '@angular/forms';
|
||||||
import { HTTP_PROVIDERS } from '@angular/http';
|
import { HTTP_PROVIDERS } from '@angular/http';
|
||||||
|
import { HAMMER_GESTURE_CONFIG } from '@angular/platform-browser';
|
||||||
|
|
||||||
import { ActionSheetController } from '../components/action-sheet/action-sheet';
|
import { ActionSheetController } from '../components/action-sheet/action-sheet';
|
||||||
import { AlertController } from '../components/alert/alert';
|
import { AlertController } from '../components/alert/alert';
|
||||||
@ -10,6 +11,7 @@ import { closest, nativeTimeout } from '../util/dom';
|
|||||||
import { Events } from '../util/events';
|
import { Events } from '../util/events';
|
||||||
import { FeatureDetect } from '../util/feature-detect';
|
import { FeatureDetect } from '../util/feature-detect';
|
||||||
import { Form } from '../util/form';
|
import { Form } from '../util/form';
|
||||||
|
import { IonicGestureConfig } from '../gestures/ionic-gesture-config';
|
||||||
import { GestureController } from '../gestures/gesture-controller';
|
import { GestureController } from '../gestures/gesture-controller';
|
||||||
import { IONIC_DIRECTIVES } from './directives';
|
import { IONIC_DIRECTIVES } from './directives';
|
||||||
import { isPresent } from '../util/util';
|
import { isPresent } from '../util/util';
|
||||||
@ -81,6 +83,8 @@ export function ionicProviders(customProviders?: Array<any>, config?: any): any[
|
|||||||
Translate,
|
Translate,
|
||||||
];
|
];
|
||||||
|
|
||||||
|
providers.push( {provide: HAMMER_GESTURE_CONFIG, useClass: IonicGestureConfig} );
|
||||||
|
|
||||||
if (isPresent(customProviders)) {
|
if (isPresent(customProviders)) {
|
||||||
providers.push(customProviders);
|
providers.push(customProviders);
|
||||||
}
|
}
|
||||||
|
25
src/gestures/ionic-gesture-config.ts
Normal file
25
src/gestures/ionic-gesture-config.ts
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
import {Injectable} from '@angular/core';
|
||||||
|
import {HammerGestureConfig} from '@angular/platform-browser';
|
||||||
|
|
||||||
|
/* this class override the default angular gesture config.
|
||||||
|
* The motivation for this is enabling pinch, rotate or
|
||||||
|
* any other multi-touch gestures block scrolling.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
@Injectable()
|
||||||
|
export class IonicGestureConfig extends HammerGestureConfig {
|
||||||
|
|
||||||
|
buildHammer(element: HTMLElement) {
|
||||||
|
var mc = new (<any> window).Hammer(element);
|
||||||
|
|
||||||
|
for (let eventName in this.overrides) {
|
||||||
|
mc.get(eventName).set(this.overrides[eventName]);
|
||||||
|
}
|
||||||
|
|
||||||
|
return mc;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
31
src/gestures/test/ionic-gesture-config.spec.ts
Normal file
31
src/gestures/test/ionic-gesture-config.spec.ts
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
import { IonicGestureConfig } from '../../../src/gestures/ionic-gesture-config';
|
||||||
|
|
||||||
|
export function run() {
|
||||||
|
|
||||||
|
describe('IonicGestureConfig', () => {
|
||||||
|
it('should create a new instance of hammer', () => {
|
||||||
|
// arrange
|
||||||
|
let instance = new IonicGestureConfig();
|
||||||
|
let expectedParam = { name: "expectedParam"};
|
||||||
|
let expectedHammerInstance = { name: "hammer"};
|
||||||
|
|
||||||
|
let actualParam : any = null;
|
||||||
|
let callCount = 0;
|
||||||
|
|
||||||
|
(<any> window).Hammer = (param: any) => {
|
||||||
|
callCount++;
|
||||||
|
actualParam = param;
|
||||||
|
return expectedHammerInstance;
|
||||||
|
};
|
||||||
|
|
||||||
|
// act
|
||||||
|
let returnValue = instance.buildHammer( <HTMLElement> <any> expectedParam);
|
||||||
|
|
||||||
|
// assert
|
||||||
|
expect(returnValue.name).toEqual(expectedHammerInstance.name);
|
||||||
|
expect(callCount).toEqual(1);
|
||||||
|
expect(actualParam.name).toEqual(expectedParam.name);
|
||||||
|
});
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
Reference in New Issue
Block a user