Skip to content

Commit 9522941

Browse files
Merge pull request #353 from aguspignal/master
Add missing gestures for Android
2 parents 7e5f5d9 + 60897f6 commit 9522941

File tree

1 file changed

+103
-102
lines changed

1 file changed

+103
-102
lines changed

src/utils/GestureHandler.tsx

Lines changed: 103 additions & 102 deletions
Original file line numberDiff line numberDiff line change
@@ -1,119 +1,120 @@
1-
import React from 'react';
2-
import { DimensionValue, I18nManager, Platform, View } from 'react-native';
1+
import React from "react"
2+
import { DimensionValue, I18nManager, Platform, View } from "react-native"
33
import {
4-
GestureHandlerRootView,
5-
GestureDetector,
6-
Gesture,
7-
Directions,
8-
TouchableWithoutFeedback,
9-
} from 'react-native-gesture-handler';
4+
GestureHandlerRootView,
5+
GestureDetector,
6+
Gesture,
7+
Directions,
8+
TouchableWithoutFeedback,
9+
} from "react-native-gesture-handler"
1010

1111
interface Props {
12-
width?: DimensionValue;
13-
height?: DimensionValue;
14-
onSingleTap: () => void;
15-
onDoubleTap: () => void;
16-
onSwipeLeft: () => void;
17-
onSwipeRight: () => void;
18-
onSwipeUp: () => void;
19-
onSwipeDown: () => void;
20-
onLongPress: () => void;
21-
children: React.ReactNode;
12+
width?: DimensionValue
13+
height?: DimensionValue
14+
onSingleTap: () => void
15+
onDoubleTap: () => void
16+
onSwipeLeft: () => void
17+
onSwipeRight: () => void
18+
onSwipeUp: () => void
19+
onSwipeDown: () => void
20+
onLongPress: () => void
21+
children: React.ReactNode
2222
}
2323

2424
export function GestureHandler({
25-
width = '100%',
26-
height = '100%',
27-
onSingleTap,
28-
onDoubleTap,
29-
onSwipeLeft,
30-
onSwipeRight,
31-
onSwipeUp,
32-
onSwipeDown,
33-
onLongPress,
34-
children,
25+
width = "100%",
26+
height = "100%",
27+
onSingleTap,
28+
onDoubleTap,
29+
onSwipeLeft,
30+
onSwipeRight,
31+
onSwipeUp,
32+
onSwipeDown,
33+
onLongPress,
34+
children,
3535
}: Props) {
36-
const singleTap = Gesture.Tap()
37-
.runOnJS(true)
38-
.maxDuration(250)
39-
.onStart(onSingleTap);
36+
const singleTap = Gesture.Tap().runOnJS(true).maxDuration(250).onStart(onSingleTap)
4037

41-
const doubleTap = Gesture.Tap()
42-
.runOnJS(true)
43-
.maxDuration(250)
44-
.numberOfTaps(2)
45-
.onStart(onDoubleTap);
38+
const doubleTap = Gesture.Tap()
39+
.runOnJS(true)
40+
.maxDuration(250)
41+
.numberOfTaps(2)
42+
.onStart(onDoubleTap)
4643

47-
const longPress = Gesture.LongPress().runOnJS(true).onStart(onLongPress);
44+
const longPress = Gesture.LongPress().runOnJS(true).onStart(onLongPress)
4845

49-
const swipeLeft = Gesture.Fling()
50-
.runOnJS(true)
51-
.direction(I18nManager.isRTL ? Directions.RIGHT : Directions.LEFT)
52-
.onStart(onSwipeLeft);
46+
const swipeLeft = Gesture.Fling()
47+
.runOnJS(true)
48+
.direction(I18nManager.isRTL ? Directions.RIGHT : Directions.LEFT)
49+
.onStart(onSwipeLeft)
5350

54-
const swipeRight = Gesture.Fling()
55-
.runOnJS(true)
56-
.direction(I18nManager.isRTL ? Directions.LEFT : Directions.RIGHT)
57-
.onStart(onSwipeRight);
51+
const swipeRight = Gesture.Fling()
52+
.runOnJS(true)
53+
.direction(I18nManager.isRTL ? Directions.LEFT : Directions.RIGHT)
54+
.onStart(onSwipeRight)
5855

59-
const swipeUp = Gesture.Fling()
60-
.runOnJS(true)
61-
.direction(Directions.UP)
62-
.onStart(onSwipeUp);
56+
const swipeUp = Gesture.Fling().runOnJS(true).direction(Directions.UP).onStart(onSwipeUp)
6357

64-
const swipeDown = Gesture.Fling()
65-
.runOnJS(true)
66-
.direction(Directions.DOWN)
67-
.onStart(onSwipeDown);
58+
const swipeDown = Gesture.Fling().runOnJS(true).direction(Directions.DOWN).onStart(onSwipeDown)
6859

69-
let lastTap: number | null = null;
70-
let timer: NodeJS.Timeout;
60+
let lastTap: number | null = null
61+
let timer: NodeJS.Timeout
7162

72-
const handleDoubleTap = () => {
73-
if (lastTap) {
74-
onDoubleTap();
75-
clearTimeout(timer);
76-
lastTap = null;
77-
} else {
78-
lastTap = Date.now();
79-
timer = setTimeout(() => {
80-
onSingleTap();
81-
lastTap = null;
82-
clearTimeout(timer);
83-
}, 500);
84-
}
85-
};
63+
const handleDoubleTap = () => {
64+
if (lastTap) {
65+
onDoubleTap()
66+
clearTimeout(timer)
67+
lastTap = null
68+
} else {
69+
lastTap = Date.now()
70+
timer = setTimeout(() => {
71+
onSingleTap()
72+
lastTap = null
73+
clearTimeout(timer)
74+
}, 500)
75+
}
76+
}
8677

87-
if (Platform.OS === 'ios') {
88-
return (
89-
<GestureHandlerRootView style={{ flex: 1 }}>
90-
<GestureDetector
91-
gesture={Gesture.Exclusive(
92-
swipeLeft,
93-
swipeRight,
94-
swipeUp,
95-
swipeDown,
96-
longPress,
97-
doubleTap,
98-
singleTap
99-
)}
100-
>
101-
<TouchableWithoutFeedback
102-
style={{ width, height }}
103-
onPress={() => Platform.OS === 'ios' && handleDoubleTap()}
104-
onLongPress={() => Platform.OS === 'ios' && onLongPress()}
105-
>
106-
{children}
107-
</TouchableWithoutFeedback>
108-
</GestureDetector>
109-
</GestureHandlerRootView>
110-
);
111-
}
112-
return (
113-
<GestureHandlerRootView style={{ flex: 1 }}>
114-
<GestureDetector gesture={Gesture.Exclusive(swipeLeft, swipeRight)}>
115-
<View style={{ width, height }}>{children}</View>
116-
</GestureDetector>
117-
</GestureHandlerRootView>
118-
);
78+
if (Platform.OS === "ios") {
79+
return (
80+
<GestureHandlerRootView style={{ flex: 1 }}>
81+
<GestureDetector
82+
gesture={Gesture.Exclusive(
83+
swipeLeft,
84+
swipeRight,
85+
swipeUp,
86+
swipeDown,
87+
longPress,
88+
doubleTap,
89+
singleTap,
90+
)}
91+
>
92+
<TouchableWithoutFeedback
93+
style={{ width, height }}
94+
onPress={() => Platform.OS === "ios" && handleDoubleTap()}
95+
onLongPress={() => Platform.OS === "ios" && onLongPress()}
96+
>
97+
{children}
98+
</TouchableWithoutFeedback>
99+
</GestureDetector>
100+
</GestureHandlerRootView>
101+
)
102+
}
103+
return (
104+
<GestureHandlerRootView style={{ flex: 1 }}>
105+
<GestureDetector
106+
gesture={Gesture.Exclusive(
107+
swipeLeft,
108+
swipeRight,
109+
swipeUp,
110+
swipeDown,
111+
longPress,
112+
doubleTap,
113+
singleTap,
114+
)}
115+
>
116+
<View style={{ width, height }}>{children}</View>
117+
</GestureDetector>
118+
</GestureHandlerRootView>
119+
)
119120
}

0 commit comments

Comments
 (0)