forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
[Android] Fix taps triggering while swiping (#7459)
* [Android] Fix taps triggering while swiping
* Revert "[Android] Try to disambiguate taps from swipes (#7448)"
This reverts commit 96054f4addb63994b3d2f5fe1d288f4dd3c246c2.
* Update patch to match callstack/react-native-pager-view#961
* Make it symmetrical
---------
Co-authored-by: Dan Abramov <dan.abramov@gmail.com>
authored by
gpp
Dan Abramov
and committed by
GitHub
5130d19e
9e3f2f43
+74
-40
+72
patches/react-native-pager-view+6.6.1.patch
+72
patches/react-native-pager-view+6.6.1.patch
···
1
+
diff --git a/node_modules/react-native-pager-view/android/build/tmp/kotlin-classes/debug/com/reactnativepagerview/NestedScrollableHost.class b/node_modules/react-native-pager-view/android/build/tmp/kotlin-classes/debug/com/reactnativepagerview/NestedScrollableHost.class
2
+
new file mode 100644
3
+
index 0000000..b64fccc
4
+
Binary files /dev/null and b/node_modules/react-native-pager-view/android/build/tmp/kotlin-classes/debug/com/reactnativepagerview/NestedScrollableHost.class differ
5
+
diff --git a/node_modules/react-native-pager-view/android/src/main/java/com/reactnativepagerview/NestedScrollableHost.kt b/node_modules/react-native-pager-view/android/src/main/java/com/reactnativepagerview/NestedScrollableHost.kt
6
+
index 91d9946..87b58d0 100644
7
+
--- a/node_modules/react-native-pager-view/android/src/main/java/com/reactnativepagerview/NestedScrollableHost.kt
8
+
+++ b/node_modules/react-native-pager-view/android/src/main/java/com/reactnativepagerview/NestedScrollableHost.kt
9
+
@@ -8,6 +8,7 @@ import android.view.ViewConfiguration
10
+
import android.widget.FrameLayout
11
+
import androidx.viewpager2.widget.ViewPager2
12
+
import androidx.viewpager2.widget.ViewPager2.ORIENTATION_HORIZONTAL
13
+
+import com.facebook.react.uimanager.events.NativeGestureUtil
14
+
import kotlin.math.absoluteValue
15
+
import kotlin.math.sign
16
+
17
+
@@ -27,6 +28,7 @@ class NestedScrollableHost : FrameLayout {
18
+
private var touchSlop = 0
19
+
private var initialX = 0f
20
+
private var initialY = 0f
21
+
+ private var nativeGestureStarted: Boolean = false
22
+
private val parentViewPager: ViewPager2?
23
+
get() {
24
+
var v: View? = parent as? View
25
+
@@ -57,17 +59,14 @@ class NestedScrollableHost : FrameLayout {
26
+
}
27
+
28
+
private fun handleInterceptTouchEvent(e: MotionEvent) {
29
+
- val orientation = parentViewPager?.orientation ?: return
30
+
-
31
+
- // Early return if child can't scroll in same direction as parent
32
+
- if (!canChildScroll(orientation, -1f) && !canChildScroll(orientation, 1f)) {
33
+
- return
34
+
- }
35
+
+ val orientation = parentViewPager?.orientation
36
+
37
+
if (e.action == MotionEvent.ACTION_DOWN) {
38
+
initialX = e.x
39
+
initialY = e.y
40
+
- parent.requestDisallowInterceptTouchEvent(true)
41
+
+ if (orientation != null) {
42
+
+ parent.requestDisallowInterceptTouchEvent(true)
43
+
+ }
44
+
} else if (e.action == MotionEvent.ACTION_MOVE) {
45
+
val dx = e.x - initialX
46
+
val dy = e.y - initialY
47
+
@@ -78,6 +77,10 @@ class NestedScrollableHost : FrameLayout {
48
+
val scaledDy = dy.absoluteValue * if (isVpHorizontal) 1f else .5f
49
+
50
+
if (scaledDx > touchSlop || scaledDy > touchSlop) {
51
+
+ NativeGestureUtil.notifyNativeGestureStarted(this, e)
52
+
+ nativeGestureStarted = true
53
+
+
54
+
+ if (orientation == null) return
55
+
if (isVpHorizontal == (scaledDy > scaledDx)) {
56
+
// Gesture is perpendicular, allow all parents to intercept
57
+
parent.requestDisallowInterceptTouchEvent(false)
58
+
@@ -94,4 +97,14 @@ class NestedScrollableHost : FrameLayout {
59
+
}
60
+
}
61
+
}
62
+
+
63
+
+ override fun onTouchEvent(e: MotionEvent): Boolean {
64
+
+ if (e.actionMasked == MotionEvent.ACTION_UP) {
65
+
+ if (nativeGestureStarted) {
66
+
+ NativeGestureUtil.notifyNativeGestureEnded(this, e)
67
+
+ nativeGestureStarted = false
68
+
+ }
69
+
+ }
70
+
+ return super.onTouchEvent(e)
71
+
+ }
72
+
}
+2
-40
src/view/com/pager/Pager.tsx
+2
-40
src/view/com/pager/Pager.tsx
···
1
-
import React, {Children, forwardRef, useCallback, useContext} from 'react'
1
+
import React, {forwardRef, useCallback, useContext} from 'react'
2
2
import {View} from 'react-native'
3
3
import {DrawerGestureContext} from 'react-native-drawer-layout'
4
4
import {Gesture, GestureDetector} from 'react-native-gesture-handler'
···
17
17
} from 'react-native-reanimated'
18
18
import {useFocusEffect} from '@react-navigation/native'
19
19
20
-
import {isAndroid} from '#/platform/detection'
21
20
import {useSetDrawerSwipeDisabled} from '#/state/shell'
22
21
import {atoms as a, native} from '#/alf'
23
22
···
149
148
style={[a.flex_1]}
150
149
initialPage={initialPage}
151
150
onPageScroll={handlePageScroll}>
152
-
{isAndroid
153
-
? Children.map(children, child => (
154
-
<CaptureSwipesAndroid>{child}</CaptureSwipesAndroid>
155
-
))
156
-
: children}
151
+
{children}
157
152
</AnimatedPagerView>
158
153
</GestureDetector>
159
154
</View>
160
155
)
161
156
},
162
157
)
163
-
164
-
// HACK.
165
-
// This works around https://github.com/callstack/react-native-pager-view/issues/960.
166
-
// It appears that the Pressables inside the pager get confused if there's enough work
167
-
// happening on the JS thread, and mistakingly interpret a pager swipe as a tap.
168
-
// We can prevent this by stealing all horizontal movements from the tree inside.
169
-
function CaptureSwipesAndroid({children}: {children: React.ReactNode}) {
170
-
const lastTouchStart = React.useRef<{x: number; y: number} | null>(null)
171
-
return (
172
-
<View
173
-
onTouchStart={e => {
174
-
lastTouchStart.current = {
175
-
x: e.nativeEvent.pageX,
176
-
y: e.nativeEvent.pageY,
177
-
}
178
-
}}
179
-
onMoveShouldSetResponderCapture={e => {
180
-
const coords = lastTouchStart.current
181
-
if (!coords) {
182
-
return false
183
-
}
184
-
const dx = Math.abs(e.nativeEvent.pageX - coords.x)
185
-
if (dx > 0) {
186
-
// This is a horizontal movement and will result in a swipe.
187
-
// Prevent pager children from receiving this touch.
188
-
return true
189
-
}
190
-
return false
191
-
}}>
192
-
{children}
193
-
</View>
194
-
)
195
-
}
196
158
197
159
function usePagerHandlers(
198
160
handlers: {