Closed winterdouglas closed 3 years ago
UIStatusBarStyleDarkContent
is available since iOS 13: https://developer.apple.com/documentation/uikit/uistatusbarstyle/uistatusbarstyledarkcontent?language=objc, so on phones with iOS < 13, it will resolve in UIStatusBarStyleLightContent
: https://github.com/software-mansion/react-native-screens/blob/master/ios/RNSScreenStackHeaderConfig.m#L570, since it is the only available option for customization. You probably shouldn't want to change the statusBarStyle
for phones with iOS < 13 unless you want it to have UIStatusBarStyleLightContent
. Can I help you more with this?
Thanks for the fast reply!
Got it. Hm but then for this case that I'm mentioning what would you suggest me to do? Cause this issue started to happen when I enabled the View controller-based status bar appearance
to support the status bar style change.
Is not passing any statusBarStyle
for iOS < 13 enough? It should resolve to default option there.
Another option is to change this line: https://github.com/software-mansion/react-native-screens/blob/master/ios/RNSScreenStackHeaderConfig.m#L570 to
if (statusBarStyle == RNSStatusBarStyleLight) {
return UIStatusBarStyleLightContent;
}
return UIStatusBarStyleDefault;
and, in JS, check for iOS version, and if it is lower than 13, pass auto
option for everywhere you want it to be default, and light
for places where you explicitly want UIStatusBarStyleLightContent
.
I think I tried with auto
and not setting that also, none of them worked. Just let me have another try here and I'm gonna mention to you if that worked.
So, confirming what I said earlier, setting it to auto
or not setting it has the same effect, the text is still white.
I did a double check also on my info.plist, and there the status bar is set as default. just to make sure.
So could you check the second proposed solution?
I think I can, but to be honest I need to ask you: can I change that locally as part of my small repro directly, or do I need to clone and build rnscreens, change it in the lib and then reference my changed version on my project?
You can use patch-package to apply changes only to your repository. I think I will make a PR with this change, but it would need to be merged and then released before you could use it.
I will give it a try then, thanks for letting me know, I haven't used that tool before :) No problems on waiting for it to be merged and released too, at least knowing that there will be a fix is already good.
I will take my time to check that and I'll let you know if that worked or not.
Good news :) With your suggested code, setting the style to auto
, dark
or not setting it will present the status bar text in black, while setting it to light
presents the text in white, which is the same behavior as when running against iOS >= 13 now.
If you can PR that I'll be more than happy and will be looking forward for the next release :D Thank you for your help!
I added #757 with this change :tada:.
Thank you!
BTW, should I've closed it already? Sorry, did it without asking by mistake.
It would have been closed automatically when #757 is merged, so technically it would be better to leave this open for other users to comment and maybe find some mistakes. But don't worry, it is not a problem. I will reopen this.
Description
I observed that when setting the
statusBarStyle
it has no effect at all on iOS 12. On newer versions of iOS that's working nicely, I checked on 13 and 14 too.I'm attaching a repro with the same setup as I'm using on my project. To setup the project I followed the react navigation instructions, and also https://github.com/software-mansion/react-native-screens/tree/master/native-stack#status-bar-managment to be able to configure the status bar.
Screenshots
Steps To Reproduce
statusBarStyle
from dark to light and vice-versa underscreenOptions
Expected behavior
The configured style should be respected.
Snack or minimal code example
StatusBarRepro.zip
Package versions