Swipeable React-native-modal with nested ScrollView

Question

I'm using the latest release of react-native-modal that implement the swipe feature

I'd like to add a ScrollView inside my modal.

Here's what i've done so far

https://snack.expo.io/ryRylJFHz

Answer 1

I know that this question is old but since there isn't an answer I am providing a solution to this.

The latest version of react-native-modal provides a prop propagateSwipe that allows swipe events to propagate to child components in your case to ScrollView

<Modal propagateSwipe={true}> 
    <ScrollView> 
       // .... other components
    </ScrollView>
<Modal>

But currently in the v11.3.1 it has a small issue when you provide swipeDirection prop and it doesn't work.

The workaround to this issue is to add TouchableOpacity component inside ScrollView. Also adding activeOpacity={1} removes opacity change animation on press.

<Modal> 
    <ScrollView> 
         <TouchableOpacity activeOpacity={1}> ... </TouchableOpacity> 
    </ScrollView>
<Modal>

You can read more here about this issue.