[英]Angular/HammerJS - Avoid rotate gestures on pinch in/out
I'm trying to launch pinch gestures without launch rotate gestures also.我也试图在不启动旋转手势的情况下启动捏合手势。 My purpose is launch both gestures separately.
我的目的是分别启动两个手势。
I have built hammer configuration in my module, as below:我已经在我的模块中构建了锤子配置,如下所示:
import * as Hammer from 'hammerjs';
import { HammerGestureConfig } from '@angular/platform-browser';
export class HammerConfig extends HammerGestureConfig{
buildHammer(element: HTMLElement)
{
const hammerManager = new Hammer(element);
let rotate = new Hammer.Rotate({enable: true});
let pinch = new Hammer.Pinch({enable: true});
let pan = new Hammer.Pan();
pan.requireFailure([rotate, pinch]);
pinch.recognizeWith(rotate);
hammerManager.add([rotate, pan, pinch]);
return hammerManager;
}
}
I am trying with:我正在尝试:
pinch.dropRecognizeWith(rotate);
and和
rotate.dropRecognizeWith(pinch);
This changes doesn't work.此更改不起作用。 Only rotate gestures are launched...
仅启动旋转手势...
If I add:如果我添加:
pinch.recognizeWith(rotate);
It launches both events...它启动了这两个事件......
Are there any way to launch them separately?有没有办法分别启动它们? I will appreciate any kind of help
我将不胜感激任何形式的帮助
I look into my projects where I use HammerJS in Angular 5, 6 and 7 apps, and I use different way to config HammerJS
.我查看了在 Angular 5、6 和 7 应用程序中使用 HammerJS 的项目,并使用不同的方式来配置
HammerJS
。
Your idea to disable rotate/pinch/pan in specific situation is correct and in accordance with documentation it's OK.您在特定情况下禁用旋转/捏合/平移的想法是正确的,并且根据文档可以。
Hire is my sample config without requireFailure
and recognizeWith
:租赁是没有我的示例配置
requireFailure
和recognizeWith
:
export class MyHammerConfig extends HammerGestureConfig {
overrides = <any>{
'swipe': {direction: Hammer.DIRECTION_ALL}, // override default settings
'pan': {direction: Hammer.DIRECTION_ALL}
};
}
@NgModule({
imports: [
AppModule
],
providers: [{
provide: HAMMER_GESTURE_CONFIG,
useClass: MyHammerConfig
}],
bootstrap: [AppComponent]
})
export class AppBrowserModule {
}
In this way your config should look like:这样你的配置应该是这样的:
export class MyHammerConfig extends HammerGestureConfig {
overrides = <any>{
'rotate': {
direction: Hammer.DIRECTION_ALL,
enable: true
}, // override default settings
'pinch': {
direction: Hammer.DIRECTION_ALL,
enable: true,
recognizeWidth: 'rotate'
},
'pan': {
direction: Hammer.DIRECTION_ALL,
requireFailure: ['rotate, pinch']
}
};
}
If this is not work for you, let me know.如果这对您不起作用,请告诉我。 I will try solve your problem tomorrow because I don't have more time today.
我明天会尝试解决您的问题,因为我今天没有更多时间。
Look also to Angular docs about overriding according with HammerJS documentation hire .根据 HammerJS 文档租用,还可以查看关于覆盖的 Angular 文档。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.