If you're using a TabNavigator it's a bit more complex because the screens on all of your tabs are rendered at once - that means that the last StatusBar config you set will be used (likely on the final tab of your tab navigator, not what the user is seeing).
To fix this we'll have to do two things
Only use the StatusBar component on our initial screen. This allows us to ensure the correct StatusBar config is used.
Leverage the events system in React Navigation and StatusBar's implicit API to change the StatusBar configuration when a tab becomes active.
First, the new Screen2.js will no longer use the StatusBar component.
Then, in both Screen1.js and Screen2.js we'll set up a listener to change the StatusBar configuration when that tab didFocus. We'll also make sure to remove the listener when the TabNavigator has been unmounted.