What is the difference between the ScrollView here and the one shipping with React Native?

[darrylyoung]

Hi, everyone!

I recently came across an issue where a modal (using React Navigation) wasn't scrolling on Android. Its contents were wrapped in a ScrollView (from react-native), and it worked fine on iOS. The only solution I've found is to use the ScrollView from react-native-gesture-handler instead. This is great, but I'd love to know why this is the case before I make the change. What are the differences, and is there anything to look out for when switching a few screens?

For context, this is how I'm using it. The container class contains flex: 1 and some padding.

<ScrollView style={styles.container} showsVerticalScrollIndicator={false}>
  <SafeAreaView>
    {/* ... */}
  </SafeAreaView>
</ScrollView>

Thanks, everyone! Have a nice day.

[j-piasecki]

The ScrollView from react-native-gesture-handler is the same as from React Native but it's also wrapped with NativeViewGestureHandler, which incorporates it to the GH's gesture system. Generally, if you have buttons, touchables or gestures from Gesture Handler inside the ScrollView, you should use the ScrollView exported by Gesture Handler. This way the gestures/components will play nice with scrolling.

[darrylyoung]

Thanks, @j-piasecki! That's really good to know.