How to disable dark-mode in React Native

Android

To disable dark mode on Android, go to styles.xml. This is the path android/app/src/main/res/values/styles.xml then add this piece of code

<item name="android:forceDarkAllowed">false</item>

Your styles.xml should now look somewhat like this

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="android:forceDarkAllowed">false</item>
        <item name="android:textColor">#000000</item>
    </style>
</resources>

Finally, look for this line of code in styles.xml

    <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">

And change it to

 <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

Rebuild your Android app.

react-native run-android

ios

For ios simply go to info.list and add this

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

Reinstall pod

cd ios && pod install

Rebuild your app

react-native run-ios

Now when you switch your phone to dark mode, it doesn't affect your app.

Please Like, share and comment.