Question

React Native 0.60.5

. Light mode in iOS 13 or earlier versions is normal. However, there is no effect in iOS 13 Dark Mode. It looks the same as setting it to light-content.

Solution

There are 2 ways to solve.

Upgrade React Native to the latest version, the latest version has fixed this problem.
Modify the RCTStatusBarManager.m file.

In Xcode, open Pods/Development Pods/React-Core/Modules/RCTStatusBarManager.m , or other editor in path node_modules/react-native/React/Modules/RCTStatusBarManager.m . Apple has added a new constant to the status bar with the latest update, so dark-content doesn't work. we can use UIStatusBarStyleDarkContent instead.

Find the following code.

RCT_ENUM_CONVERTER(UIStatusBarStyle, (@{
  @"default": @(UIStatusBarStyleDefault),
  @"light-content": @(UIStatusBarStyleLightContent),
  @"dark-content": @(UIStatusBarStyleDefault),
}), UIStatusBarStyleDefault, integerValue);

Change to


RCT_ENUM_CONVERTER(UIStatusBarStyle, (@{
  @"default": @(UIStatusBarStyleDefault),
  @"light-content": @(UIStatusBarStyleLightContent),
  @"dark-content": (@available(iOS 13.0, *)) ? @(UIStatusBarStyleDarkContent) : @(UIStatusBarStyleDefault),
}), UIStatusBarStyleDefault, integerValue);

React Native StatusBar dark-content not working on iOS 13 dark appearance

Question

Solution