javascriptreact-nativereact-navigationstack-navigator

Stack navigator causes background color to change in React Native


I am making an app in React Native. I had made one of the screens and decided to add a stack navigator for navigation. However, when I added the stack navigator, the background color of the screen changed to this light grey. I want it to go back to default white. Also, before you ask, no, adding backgroundColor: 'white' to the css of the view doesn't work. For some reason it only makes half of the screen white and the other half stays grey. How can I make the screen background color go back to default white.


Solution

  • cardStyle Style object for the card in stack. You can provide a custom background color to use instead of the default background here.

    You can also specify { backgroundColor: 'transparent' } to make the previous screen visible underneath (for transparent modals). This is useful to implement things like modal dialogs. You should also specify mode: 'modal' in the stack view config when using a transparent background so previous screens aren't detached and stay visible underneath.