react native bottom sheet above the bottom menu
//you will need to use BottomSheetModal and add its provider to the root component of you application
import { BottomSheetModalProvider } from '@gorhom/bottom-sheet'
const App = () => {
return (
<BottomSheetModalProvider>
<Navigation /> // this is my app entry component (react-navigation Navigator), use yours
</BottomSheetModalProvider>
)react native elements bottom sheet
//#react native elements bottom sheet close on back button press
<BottomSheet
isVisible={isModelVisible}
modalProps={{
animationType: 'fade',
hardwareAccelerated: true,
onRequestClose: () => {
setModelVisible(false);
},
}}>
....
<BottomSheet/>react native bottom sheet above the bottom menu
//Use this package
//https://github.com/gorhom/react-native-portal
If you want to use sheet not modal
import { PortalProvider,Portal,PortalHost } from '@gorhom/portal';
const App = () => {
return (
<SafeAreaProvider>
<PortalProvider>
<Navigation />
</PortalProvider>
</SafeAreaProvider>
);
};
export default App;
=========================================
// now wrap the sheet with Portal on your screen
<Portal>
<BottomSheet
ref={bottomSheetRef}
index={-1}
snapPoints={snapPoints}
onChange={handleSheetChanges}
>
<View style={styles.contentContainer}>
<Text style={styles.bottomSheetTitle}>Add Customer</Text>
</View>
</BottomSheet>
</Portal>
<PortalHost name="custom_host" /> // Name to be used as an idCopyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
