Join GitHub today
GitHub is home to over 40 million developers working together to host and review code, manage projects, and build software together.Sign up
Status Bar changes occur instantly on pushing onto a StackNavigator, but are delayed on pressing the back button #3964
The code is available in the snack, but essentially we have a simple StackNavigator with two screens. Each screen has a StyleBar barStyle defined in its render method. Example:
When transitioning down the stack navigator, the status bar style works as expected and changes the status bar at the moment the screen transition begins. When transitioning up the stack navigator (using the goBack navigation option or pressing back in the default header), the status bar style does not work as expected and instead changes the color only at the end of the screen-transition animation.
I expect that if the colors of the status bar are signaled to change in a renderer, that they should always change at the beginning of a transition animation regardless of the version the navigator progresses in.
Note I did see somewhere that StatusBar options could be defined directly in the stack and not only on individual screen components. If that solves my issue and removes the animation delay, a quick code snippet or a point in the right direction would be highly appreciated.
How to reproduce
Notice that on either android or iOS, the original home screen status bar is light (on iOS, this should make it nearly invisible on the white background).
Click the button in the center of the screen "Go to details."
Notice that the status bar immediately changes color before the screen change animation is complete.
Click the back button on Android or the back button in the header on iOS.
Notice that the status bar does not change color until the transition animation is complete.
The StatusBar only updates when the screen is (re)rendered.
You can unify the experience using the
I updated your snack to show this: https://snack.expo.io/Hkr8Vn0sG
Actually, I made a bit of an error, and I need to re-open the issue. I need a way to update the status bar for a given screen the moment that the back button is pressed. Is there a way to do that? So, for example, when the back button is pressed, before the previous screen is re-rendered the status bar changes to some static option for that screen.
I think you could implement this in