How to make ViewPager be more aggressive in responding to horizontal gesture when nested inside a vertical ScrollView?

Hi everyone,

Users are reporting that it is difficult to use the ViewPager to successfully scroll left and right between images, since the ScrollView that the ViewPager is nested in seems to grab the event more than it should.

Example

Indeed, I compared my app to Google Maps which has a very similar UI: A horizontally scrollable set of images inside a vertically scrolling parent view. In Google Maps, I can move my finger at 45 degrees to either side, and the horizontal images view takes the event. In my app, moving my finger 45 degrees is picked up by the ScrollView and the entire page begins scrolling up and down.

Here, the purple arrows are what is handled by both apps successfully. The blue arrows are what is handled successfully by Google Maps but not by ScrollView/ViewPager. In Google Maps, the result is a horizontal scroll, in my app the result is a vertical scroll - and angry users.

I have looked into the props and found: ViewPager.onStartShouldSetResponder and ViewPager.onMoveShouldSetResponderCapture. I tried providing a function that always returns true for both, but got no effect in my app. I also tried the same props but returning false for the ScrollView. Still nothing. I also tried ScrollView.disableScrollViewPanResponder, although I’m not really sure what this does.

Somewhat at a loss here, can anyone help?

[zholmes1]

@dcoulter45 I stopped using ViewPager and replaced it with FlatList with pagingEnabled. Works really well honestly and doesn’t require an extra native library. And it definitely responds more naturally to gestures when inside a ScrollView

[tothvoj-gl]

We are facing the same issue. Here is a nice article explaining the source of the issue: https://bladecoder.medium.com/fixing-recyclerview-nested-scrolling-in-opposite-direction-f587be5c1a04

There is a workaround which we are using, but it has some drawbacks. We are decreasing the pager swipe sensitivity, however you need to find the sweet spot between fixing this issues and making the swiping too hard.