1 possible answer(s) on “Tap outside to close bottom sheet

  1. Hi for temporary workaround I able to close the bottom sheet by wrapping the children with some clickable backdrop

    here is the snippet:

    // to get screen height you can use https://github.com/facebook/react-native/issues/23693#issuecomment-523640102
    const height = yourFunctionToGetScreenHeight()
    
    // omitted code
    
                        <BottomSheet isVisible={isVisible} modalProps={{ onRequestClose: () => { setIsVisible(false)}}} >
                                <TouchableWithoutFeedback onPress={() => setIsVisible(false)}>
                                    <View style={{ flex: 1, height: height }}   > 
                                        <TouchableWithoutFeedback>
                                              
                                              // Your bottom sheet content is here
                                              // example: 
                                            <View style={tailwind('absolute bottom-0 right-0 left-0 bg-white flex p-10 mx-4')}>
                                                <Text style={tailwind('text-black')}>Helloo theree</Text>
                                                <Button title="click me" onPress={() => { console.log('the child clicked and not triggering close') }}>
                                                </Button>
                                            </View>
    
                                        </TouchableWithoutFeedback>
                                    </View>
                                </TouchableWithoutFeedback>
                        </BottomSheet>