React native modal not swiping down to close

I am using modal from react-native to display a bigger view of an image:

import {  Modal } from 'react-native'


<Modal
        animationType="slide"
        visible={this.state.modalOpen}
        presentationStyle="pageSheet"
        swipeDirection='down' 
        swipeThreshold={50} 
        onSwipeComplete={()=> this.closeImageModal()}
        onDismiss={() => this.closeImageModal()}>
            
        <View  style={{ flex: 1, backgroundColor: '#121212', justifyContent: 'center', alignItems: 'center'}}>
            <TouchableOpacity 
                style={{padding: 15}}
                onPress = { () => this.closeImageModal() }>
                <Ionicons name="ios-close-circle" size={30} color="red" />
            </TouchableOpacity>

            <Image
                source={{ uri: this.state.image }}
                style={styles.fullScreenImage}
            />
        </View>
    </Modal>

Right now, I need to press the touchable opacity above the image to close the modal.

I have tried using react-native-modal, and it has been extremely glitchy and difficult to use in my application, so I decided to stick with the modal from react native. Is there any way I can implement swiping down to close with this modal, without having to use react-native-modal?