mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-11-05 13:26:48 +08:00
feat: cancel contradictory gesture events (#7296)
BREAKING CHANGES:
Old behavior:
- iOS/Android:
- double tap: child tap -> parent tap -> child double tap -> parent double tap
- tap: child tap -> parent tap
New behavior:
- iOS
- double tap: child double tap
- tap: child tap
- Android
- double tap: child double tap -> parent double tap
- tap: child tap -> parent tap
Migration steps:
Move event handlers accordingly.
This commit is contained in:
committed by
Martin Yankov
parent
c5db112b8d
commit
b8a82f279e
@@ -7,43 +7,49 @@ import * as stackLayoutModule from "tns-core-modules/ui/layouts/stack-layout";
|
||||
|
||||
export function createPage() {
|
||||
|
||||
var stack = new stackLayoutModule.StackLayout();
|
||||
var labelHeight = Math.round(deviceProperties.screen.mainScreen.heightPixels / (7 * deviceProperties.screen.mainScreen.scale));
|
||||
var stopButton = new button.Button();
|
||||
const stack = new stackLayoutModule.StackLayout();
|
||||
const labelHeight = Math.round(deviceProperties.screen.mainScreen.heightPixels / (7 * deviceProperties.screen.mainScreen.scale));
|
||||
const stopButton = new button.Button();
|
||||
stopButton.text = "Stop Detecting Gestures";
|
||||
stack.addChild(stopButton);
|
||||
|
||||
var tapLabel = new labelModule.Label();
|
||||
const tapLabel = new labelModule.Label();
|
||||
tapLabel.text = "Tap here";
|
||||
stack.addChild(tapLabel);
|
||||
|
||||
var doubletapLabel = new labelModule.Label();
|
||||
const doubletapLabel = new labelModule.Label();
|
||||
doubletapLabel.text = "Double Tap here";
|
||||
stack.addChild(doubletapLabel);
|
||||
|
||||
var longpressLabel = new labelModule.Label();
|
||||
const longpressLabel = new labelModule.Label();
|
||||
longpressLabel.text = "Long Press here";
|
||||
stack.addChild(longpressLabel);
|
||||
|
||||
var swipeLabel = new labelModule.Label();
|
||||
const tapAndDoubleTapLabel = new labelModule.Label();
|
||||
tapAndDoubleTapLabel.height = labelHeight;
|
||||
tapAndDoubleTapLabel.text = "Tap or Double Tap";
|
||||
tapAndDoubleTapLabel.textWrap = true;
|
||||
stack.addChild(tapAndDoubleTapLabel);
|
||||
|
||||
const swipeLabel = new labelModule.Label();
|
||||
swipeLabel.height = labelHeight;
|
||||
swipeLabel.text = "Swipe here";
|
||||
swipeLabel.textWrap = true;
|
||||
stack.addChild(swipeLabel);
|
||||
|
||||
var panLabel = new labelModule.Label();
|
||||
const panLabel = new labelModule.Label();
|
||||
panLabel.height = labelHeight;
|
||||
panLabel.text = "Pan here";
|
||||
panLabel.textWrap = true;
|
||||
stack.addChild(panLabel);
|
||||
|
||||
var pinchLabel = new labelModule.Label();
|
||||
const pinchLabel = new labelModule.Label();
|
||||
pinchLabel.height = labelHeight;
|
||||
pinchLabel.text = "Pinch here";
|
||||
pinchLabel.textWrap = true;
|
||||
stack.addChild(pinchLabel);
|
||||
|
||||
var rotaionLabel = new labelModule.Label();
|
||||
const rotaionLabel = new labelModule.Label();
|
||||
rotaionLabel.height = labelHeight;
|
||||
rotaionLabel.text = "Rotate here";
|
||||
rotaionLabel.textWrap = true;
|
||||
@@ -57,6 +63,8 @@ export function createPage() {
|
||||
observer5.disconnect();
|
||||
observer6.disconnect();
|
||||
observer7.disconnect();
|
||||
observer8.disconnect();
|
||||
observer9.disconnect();
|
||||
tapLabel.text = "Gestures detection disabled";
|
||||
doubletapLabel.text = "Gestures detection disabled";
|
||||
longpressLabel.text = "Gestures detection disabled";
|
||||
@@ -64,56 +72,69 @@ export function createPage() {
|
||||
panLabel.text = "Gestures detection disabled";
|
||||
pinchLabel.text = "Gestures detection disabled";
|
||||
rotaionLabel.text = "Gestures detection disabled";
|
||||
tapAndDoubleTapLabel.text = "Gestures detection disabled";
|
||||
});
|
||||
|
||||
tapLabel.on(gestures.GestureTypes.tap, function (args: gestures.GestureEventData) {
|
||||
tapLabel.text = "Tap gesture detected, " + (args.object === tapLabel);
|
||||
});
|
||||
|
||||
var observer1 = tapLabel.getGestureObservers(gestures.GestureTypes.tap)[0];
|
||||
const observer1 = tapLabel.getGestureObservers(gestures.GestureTypes.tap)[0];
|
||||
|
||||
doubletapLabel.on(gestures.GestureTypes.doubleTap, function (args: gestures.GestureEventData) {
|
||||
doubletapLabel.text = "Double Tap gesture detected, " + (args.object === doubletapLabel);
|
||||
});
|
||||
|
||||
var observer2 = doubletapLabel.getGestureObservers(gestures.GestureTypes.doubleTap)[0];
|
||||
const observer2 = doubletapLabel.getGestureObservers(gestures.GestureTypes.doubleTap)[0];
|
||||
|
||||
longpressLabel.on(gestures.GestureTypes.longPress, function (args: gestures.GestureEventData) {
|
||||
longpressLabel.text = "Long Press gesture detected, " + (args.object === longpressLabel);
|
||||
});
|
||||
|
||||
var observer3 = longpressLabel.getGestureObservers(gestures.GestureTypes.longPress)[0];
|
||||
const observer3 = longpressLabel.getGestureObservers(gestures.GestureTypes.longPress)[0];
|
||||
|
||||
swipeLabel.on(gestures.GestureTypes.swipe, function (args: gestures.SwipeGestureEventData) {
|
||||
swipeLabel.text = "Swipe Direction: " + args.direction + ", " + (args.object === swipeLabel); // + getStateAsString(args.state);
|
||||
});
|
||||
|
||||
var observer4 = swipeLabel.getGestureObservers(gestures.GestureTypes.swipe)[0];
|
||||
const observer4 = swipeLabel.getGestureObservers(gestures.GestureTypes.swipe)[0];
|
||||
|
||||
panLabel.on(gestures.GestureTypes.pan, function (args: gestures.PanGestureEventData) {
|
||||
panLabel.text = "Pan deltaX:" + Math.round(args.deltaX) + "; deltaY:" + Math.round(args.deltaY) + ";" + ", " + (args.object === panLabel) + getStateAsString(args.state);
|
||||
});
|
||||
|
||||
var observer5 = panLabel.getGestureObservers(gestures.GestureTypes.pan)[0];
|
||||
const observer5 = panLabel.getGestureObservers(gestures.GestureTypes.pan)[0];
|
||||
|
||||
pinchLabel.on(gestures.GestureTypes.pinch, function (args: gestures.PinchGestureEventData) {
|
||||
pinchLabel.text = "Pinch Scale: " + Math.round(args.scale) + ", " + (args.object === pinchLabel) + getStateAsString(args.state);
|
||||
});
|
||||
|
||||
var observer6 = pinchLabel.getGestureObservers(gestures.GestureTypes.pinch)[0];
|
||||
const observer6 = pinchLabel.getGestureObservers(gestures.GestureTypes.pinch)[0];
|
||||
|
||||
rotaionLabel.on(gestures.GestureTypes.rotation, function (args: gestures.RotationGestureEventData) {
|
||||
rotaionLabel.text = "Rotation: " + Math.round(args.rotation) + ", " + (args.object === rotaionLabel) + getStateAsString(args.state);
|
||||
});
|
||||
|
||||
var observer7 = rotaionLabel.getGestureObservers(gestures.GestureTypes.rotation)[0];
|
||||
const observer7 = rotaionLabel.getGestureObservers(gestures.GestureTypes.rotation)[0];
|
||||
|
||||
var page = new pages.Page();
|
||||
tapAndDoubleTapLabel.on(gestures.GestureTypes.doubleTap, function (args: gestures.GestureEventData) {
|
||||
tapAndDoubleTapLabel.text = "Last action: Double tap gesture, " + (args.object === tapAndDoubleTapLabel);
|
||||
});
|
||||
|
||||
const observer8 = tapAndDoubleTapLabel.getGestureObservers(gestures.GestureTypes.doubleTap)[0];
|
||||
|
||||
tapAndDoubleTapLabel.on(gestures.GestureTypes.tap, function (args: gestures.GestureEventData) {
|
||||
tapAndDoubleTapLabel.text = "Last action: Tap gesture, " + (args.object === tapAndDoubleTapLabel);
|
||||
});
|
||||
|
||||
const observer9 = tapAndDoubleTapLabel.getGestureObservers(gestures.GestureTypes.tap)[0];
|
||||
|
||||
const page = new pages.Page();
|
||||
page.content = stack;
|
||||
return page;
|
||||
}
|
||||
|
||||
var states = new Array<string>();
|
||||
const states = new Array<string>();
|
||||
function getStateAsString(state: gestures.GestureStateTypes): string {
|
||||
if (state === gestures.GestureStateTypes.began) {
|
||||
states.length = 0;
|
||||
|
||||
Reference in New Issue
Block a user