carousel-example
Item vertical scroll interferes with carousel horizontal scroll
This is a small project that reproduces the issue. (created with npx react-native init CarouselExample --version 0.62.0)
I have a carousel where each item is a card that has a title and a WebView. On Android, when attempting to scroll the web page loaded in the webview, the gesture handler of the Carousel gets fired instead, most of the time. On iOS, everything works fine.
Here are gifs showing the issue. The iOS build works fine, but for Android it's virtually impossible to scroll a webpage vertically without triggering the horizontal Carousel scroll.
iOS
Android
Initialize
- clone the repo
- cd
carousel-example - run
yarn - run
cd ios; pod install; cd ..
Run
- start the metro bundler
yarn start - start the iOS app
yarn ios - start the Android app
yarn android
The project uses npx, but it can be run without it if you have react-native installed globally
react-native start
react-native run-ios
react-native run-android