how to customize React native Navigation cardoverlay styles?

user_13690899 0
Viewed 378

i would like to implement this black background on the react native navigation stack navigator. I know that passing

a couple properties like these:

options={{
    gestureEnabled: true,
    cardOverlayEnabled: true,
    ...TransitionPresets.ModalSlideFromBottomIOS,
    cardStyleInterpolator: CardStyleInterpolators.forModalPresentationIOS,
    mode: 'modal',
}

how can this be implemented? the cardOverlayEnabled provides grey-ish tone. i tried to add a View flex 1 with black background, but when i do so, i lost the screen in the back

enter image description here

react-navigation react-native reactjs javascript
1 Answers

so the answer has nothing to do with overlay. Actually, all the new pages will place on top of each other if you set various pages to open like a swipe up modal like that, and the page that you have not set to up like this but instead place like a full page, this full page will be placed in the very bottom. With this, if you set a black view wrapping your routes, will give a black background effect as desired.

user_136908990
Related