How to force disable iOS dark mode in React Native

Question

The new iOS 13 update introduces an optional system-wide. This causes e.g. the StatusBar to have light text, which might become unreadable on a white background. It also breaks the iOS Datetime Picker (see DatePickerIOS or react-native-modal-datetime-picker)

David Schumann · Accepted Answer · 2019-10-16T23:02:05.187

88

The solution is to either

add this to your Info.plist file:

    <key>UIUserInterfaceStyle</key>
    <string>Light</string>

OR

Add this to your AppDelegate.m:

    if (@available(iOS 13.0, *)) {
        rootView.overrideUserInterfaceStyle = UIUserInterfaceStyleLight;
    }

edited Oct 16 '19 at 23:02

answered Oct 15 '19 at 13:29

David Schumann

13,380
9
75
96

1

@Hazwin that sounds unlikely – Maxim Zubarev Jan 12 '20 at 14:27
@MaximZubarev I guess he is referring to https://stackoverflow.com/a/56546554/827027 – dwn Feb 04 '20 at 09:40
@Hazwin that's not true if you are using an updated version of Xcode and can be very misleading for someone reading the comments. I have more than one app in the app store using UIUserInterfaceStyle ligth in Info.plist – Jero Feb 19 '20 at 21:12
1

@Jero yes. my bad. I was referring to https://stackoverflow.com/questions/56537855/is-it-possible-to-opt-out-of-dark-mode-on-ios-13/56546554#56546554 – Haswin Feb 27 '20 at 06:42

score 3 · Answer 2 · answered Jul 20 '20 at 14:28

3

In your app.json file add:

{
  "expo": {
     ...
     "ios": {
      "infoPlist": {
        "UIUserInterfaceStyle": "Light"
      }
    },
}

answered Jul 20 '20 at 14:28

Matthew Berman

39
3

score 1 · Answer 3 · answered Mar 02 '22 at 01:03

This work for me

Add this to Info.plist

<key>UIUserInterfaceStyle</key>
<string>Light</string>

And this to your AppDelegate.m

  if (@available(iOS 13.0, *)) {
      rootView.backgroundColor = [UIColor systemBackgroundColor];
    self.window.overrideUserInterfaceStyle = UIUserInterfaceStyleLight;
  } else {
      rootView.backgroundColor = [UIColor whiteColor];
  }

score 0 · Answer 4 · answered Jul 23 '20 at 22:49

This solution seems to work best. Add this in your AppDelagate.m

  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
  UIViewController *rootViewController = [UIViewController new];
  rootViewController.view = rootView;
  self.window.rootViewController = rootViewController;
  [self.window makeKeyAndVisible];

  //add this here vv

  if (@available(iOS 13, *)) {
     self.window.overrideUserInterfaceStyle = UIUserInterfaceStyleLight;
  }

  //add this here ^^




 return YES;

score 0 · Answer 5 · answered Dec 02 '21 at 07:57

0

Add this in your Info.plist

<key>UIUserInterfaceStyle</key>
    <string>Light</string>

And this to your AppDelegate.m

  rootView.backgroundColor = [UIColor whiteColor];

answered Dec 02 '21 at 07:57

Akshay Shenoy

1,194
8
10

How to force disable iOS dark mode in React Native

5 Answers5