The screen is getting blocked when a modal has been swiped down on iOS

Expo SDK
1

Please provide the following:
1. SDK Version: 37
*2. Platforms(Android/iOS/web/all): iOS *

Hello everyone.
I got stuck trying to handle the situation when a user opened a modal and then swiped it down, and thereby the modal got closed.

I made a separate component for the modal and are trying to handle managing its visibility from the page state.

The modal code is:

const CustomModal = props => {
    const [visibility, setVisibility] = useState(false);
    const { visible } = props;
    useEffect(() => {
        setVisibility(!!visible);
    }, [visible])

    return <Modal
        onDismiss={props.onClose}
        onRequestClose={props.onClose}
        presentationStyle="pageSheet"
        animationType="slide"
        transparent={false}
        visible={visibility}>
            <View style={styles.container}>
                <TouchableOpacity onPress={props.onClose}>
                     <Text>Hide</Text>
                </TouchableOpacity>
            </View>
    </Modal>;
};

It is placed on a page and is managed by the page state and a button placed on that page.

const MainScreen = props = {
    const [modalVisible, setModalVisible] = useState(false);
    // ...
    return <View>
        // ...
        <CustomModal visible={modalVisible} onClose={() => { setModalVisible(false); }}/>
    </View>;
};

It is working fine when a user closes the modal using the Hide button inside the modal. In that case, the modal could be reopened by the user, and all buttons are interactable. When the modal is closed swiping down, it can’t be reopened on iOS, and all controls on the page are blocked.

I tried to put some debug logs into methods supported by Modal which are onDismiss and onRequestClose, but these are NOT getting called when the window is closed by swiping down.

What am I doing wrong here? Is there any way to handle this swipe down on a modal in order to update the state of the page?

UPDATE:
I found out that the problem is known but has not found any solution on the internet. Basically, a swiped modal does not fire the onDismiss or any other event so the modal is not under control, and the page state is not managed.

I would be happy if anyone knows a workaround to get over this.

2

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.