-
-
Notifications
You must be signed in to change notification settings - Fork 1k
[iOS] Fix GestureDetector
on Text
#3591
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
packages/react-native-gesture-handler/apple/RNGestureHandler.mm
Outdated
Show resolved
Hide resolved
packages/react-native-gesture-handler/apple/RNGestureHandler.mm
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I assume you've tested this change on older versions of RN (0.78) as well.
If by tested you mean tested attached example then yes, I did 😅 |
## Description ### Problem Currently the following configuration: ```jsx <GestureDetector ... > <Text> ... </Text> </GestureDetector> ``` does not work on `iOS`. This is due to change `react-native` introduced in 0.79 - `hitTest` in `RCTParagraphTextView` now returns `nil` by default ([see here](https://github.com/facebook/react-native/blob/dcbbf275cbc4150820691a4fbc254b198cc92bdd/packages/react-native/React/Fabric/Mounting/ComponentViews/Text/RCTParagraphComponentView.mm#L379)). This results in native `UIGestureRecognizer` not responding to touches. ### Solution We no longer attach native recognizer to `RCTParagraphTextView`, but to its parent - `RCTParagraphComponentView`. The problem with this approach is that `handleGesture` method uses `reactTag` property, which on `RCTParagraphComponentView` is `nil`. This is why we use `reactTag` from `RCTParagraphTextView` when sending event to `JS` side. Fixes #3581 ## Test plan <details> <summary>Tested on the following code:</summary> ```jsx import React from 'react'; import { StyleSheet, Text } from 'react-native'; import { Gesture, GestureDetector, GestureHandlerRootView, } from 'react-native-gesture-handler'; export default function EmptyExample() { const g = Gesture.Tap().onEnd(() => { console.log('Tapped!'); }); return ( <GestureHandlerRootView style={styles.container}> <GestureDetector gesture={g}> <Text> Click me <Text> Me too! </Text> </Text> </GestureDetector> </GestureHandlerRootView> ); } const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', }, }); ``` </details>
Hi, I'm running into this as well. Any idea when this will be released? |
Hi @Daumis102!
I cannot give any ETA since we don't have release plans now. But I will keep that in mind and discuss it with the team 😅 |
Hi @Daumis102! FYI, I've just released 2.27.2 which includes this PR 😅 |
Thank you! |
Description
Problem
Currently the following configuration:
does not work on
iOS
. This is due to changereact-native
introduced in 0.79 -hitTest
inRCTParagraphTextView
now returnsnil
by default (see here). This results in nativeUIGestureRecognizer
not responding to touches.Solution
We no longer attach native recognizer to
RCTParagraphTextView
, but to its parent -RCTParagraphComponentView
. The problem with this approach is thathandleGesture
method usesreactTag
property, which onRCTParagraphComponentView
isnil
. This is why we usereactTag
fromRCTParagraphTextView
when sending event toJS
side.Fixes #3581
Test plan
Tested on the following code: