No pan responder events fired from SVG elements inside a Modal on Android
See original GitHub issuereact-native-svg@6.0.0-rc1 react-native@0.48.3 react@16.0.0-alpha.12
I have a responder on individual (nested) children (<G>s
) of an <SVG> node.
This stopped working on Android. No events get fired (or at least none of the handlers gets called).
This is how I used to be able to make it work:
componentWillMount() {
console.log('WILL MOUNT');
this.panResponder = PanResponder.create({
onStartShouldSetPanResponder: this.handleStartShouldSetPanResponder,
onMoveShouldSetPanResponder: this.handleMoveShouldSetPanResponder,
onPanResponderGrant: this.handlePanResponderGrant,
onPanResponderMove: this.handlePanResponderMove,
onPanResponderRelease: this.handlePanResponderEnd,
onPanResponderTerminate: this.handlePanResponderEnd,
onPanResponderTerminationRequest: this.handlePanResponderTerminationRequest
});
}
...
render() {
return (
<SVG>
<G
{...this.panResponder.panHandlers}
>
...
</G>
</SVG>
);
}
Issue Analytics
- State:
- Created 6 years ago
- Reactions:1
- Comments:16
Top Results From Across the Web
No pan responder events fired from SVG elements inside a ...
I have a responder on individual (nested) children ( <G>s ) of an node. This stopped working on Android. No events get fired...
Read more >PanHandler doesn't detect touch events inside Modal
The PanHandler works for all the content inside the page, but not when a Modal is shown. The touch events inside the modal...
Read more >PanResponder - React Native
By default, PanResponder holds an InteractionManager handle to block long-running JS events from interrupting active gestures.
Read more >touch-action - CSS: Cascading Style Sheets - MDN Web Docs
An application using Pointer events will receive a pointercancel event when the browser starts handling a touch gesture. By explicitly ...
Read more >Introduction | React Native Gesture Handler - Software Mansion
A way to use a platform's native touch handling system for recognizing pinch, rotation and pan (besides a few other gestures). The ability...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Same issue here. I fixed but looks like a workaround…
I tried to add panResponder. panHandlers to SVG parent node and it works (I mean not to the child Rect as in the previous example)… but honestly I don’t know if there is something of counterproductive…
What is the status of this issue? I tried react-native-svg@6.0.1-rc2 and it’s still broken for Android only (works perfectly on iOS).