Different behaviour panResponder inside scrollview on android and ios
See original GitHub issue- Review the documentation: https://facebook.github.io/react-native
- Search for existing issues: https://github.com/facebook/react-native/issues
- Use the latest React Native release: https://github.com/facebook/react-native/releases
Environment
React Native Environment Info:
System:
OS: macOS High Sierra 10.13.6
CPU: x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Memory: 1.53 GB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 10.12.0 - /usr/local/bin/node
Yarn: 1.10.1 - /usr/local/bin/yarn
npm: 6.4.1 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.0, macOS 10.14, tvOS 12.0, watchOS 5.0
Android SDK:
Build Tools: 23.0.1, 25.0.0, 25.0.2, 25.0.3, 26.0.1, 26.0.2, 26.0.3, 27.0.3
API Levels: 23, 25, 26
IDEs:
Xcode: 10.0/10A255 - /usr/bin/xcodebuild
npmPackages:
react: ^16.5.0 => 16.5.0
react-native: ^0.57.2 => 0.57.2
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7
react-native-sensors: 4.0.0
react-native-store-review: 0.1.5
Description
I’ve made a simple demo which shows different behaviour between ios and android when using PanResponder
on a View
inside a ScrollView
.
iOS: If I scroll over the red square, the panResponder triggers onPanResponderTerminate
, so the ScrollView takes over
Android: If I scroll over the red square, the panResponder triggers onPanResponderMove
, so the ScrollView doesn’t scroll.
I don’t know which one is the right behaviour, but I’d like to reproduce the iOS behaviour for both.
Reproducible Demo
https://snack.expo.io/@svrnlombaert/panresponder-behaviour-on-scroll
Android behaviour: https://i.imgur.com/UXjajkr.gifv
iOS behaviour: https://i.imgur.com/4YImWKL.gifv
Issue Analytics
- State:
- Created 5 years ago
- Reactions:7
- Comments:7
Top Results From Across the Web
React-Native: Panresponder inside of a scrollview on Android
I have a ScrollView that contains elements which utilize a panresponder that relies on scrollEnabled to toggle the ScrollView's, well, scrolling ...
Read more >Pan Responder Inside of a ScrollView - Code Daily
Lets talk PanResponder in a ScrollView . This gets brought up frequently, so lets address it. Scenario. You've got a PanResponder in your...
Read more >ScrollView - React Native
Component that wraps platform ScrollView while providing integration with touch locking "responder" system. Keep in mind that ScrollViews must ...
Read more >Reactnative: Scrollview Inside of Panresponder - ADocLib
I am using a ScrollView inside of a PanResponder.On Android it works fine but on iOS the ScrollView will not scroll.I did some...
Read more >prevent touch parent on children view react native - You.com
In my case I simply put the View inside another TouchableOpacity (with ... about the same incorrect behaviour applying to Touchable s within...
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
I just created an empty 0.59.1 project (using react-native-cli), pasted the code from the snack above, and can confirm, the issue persists.
Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.