Skip to content

Commit b696961

Browse files
authored
fix: overlapping buttons cause buttons to stop being responsive (#3371)
## Description Partially resolves problem in #3370 This PR fixes an issue where a behind button could stay stuck in the "pressed" state if another overlapping button took the responder. By adding a check in onTouchEvent, we ensure that only one button can stay pressed at a time. If another button is already the responder, the behind button cancels itself and won't remain highlighted. It will not solve the issue if both button are not exclusive. For this edge case better solution is needed. ## With this fix: https://github.com/user-attachments/assets/b88ff1d1-cf1c-4a62-9967-7dd25e2f3dc0 ## Without this fix: https://github.com/user-attachments/assets/b69771d2-655c-4fa6-b5b2-9edd37d32e9c ## Test plan https://snack.expo.dev/@oblador/gesture-handler-overlap-reproduction <details> <summary>Collapsed test code</summary> ```tsx import { Text, View, StyleSheet, ScrollView } from 'react-native'; import { BaseButton, GestureHandlerRootView, } from 'react-native-gesture-handler'; export default function App() { return ( <GestureHandlerRootView> <View style={styles.container}> <BaseButton style={styles.button} shouldCancelWhenOutside={true} onHandlerStateChange={(event) => console.log(event.nativeEvent)}> <Text>Behind</Text> </BaseButton> <BaseButton style={[styles.button, styles.onTop]} shouldCancelWhenOutside={true} onHandlerStateChange={(event) => console.log(event.nativeEvent)}> <Text>On top</Text> </BaseButton> </View> </GestureHandlerRootView> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#ecf0f1', justifyContent: 'center', }, button: { padding: 30, borderWidth: 1, backgroundColor: '#ffffff99', }, onTop: { position: 'relative', top: -40, left: 100, right: 20, }, }); ``` </details>
1 parent 3ce634d commit b696961

File tree

1 file changed

+9
-0
lines changed

1 file changed

+9
-0
lines changed

android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerButtonViewManager.kt

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -296,6 +296,15 @@ class RNGestureHandlerButtonViewManager : ViewGroupManager<ButtonViewGroup>(), R
296296
val eventTime = event.eventTime
297297
val action = event.action
298298

299+
if (touchResponder != null && touchResponder !== this && touchResponder!!.exclusive) {
300+
if (isPressed) {
301+
setPressed(false)
302+
}
303+
lastEventTime = eventTime
304+
lastAction = action
305+
return false
306+
}
307+
299308
if (event.action == MotionEvent.ACTION_CANCEL) {
300309
tryFreeingResponder()
301310
}

0 commit comments

Comments
 (0)