React-native: Problem when trying to disable dark mode on Android.

[RBalconi]

Hello people,
I'm learning react / react native and along, making an app to practice. What is happening is that when the device's darkmode is active it implies the colors chosen in the application (an example below). I do not intend to invest time in and do darkmode now, I would like to learn more about React, make the whole app, and then go to the more "superficial" parts and make darkmode within the config of the app itself.

Would it be possible to inhibit / prevent the device's Dark Mode from interfering with the colors of the app?

It's done with my app design 😥

I'm testing the app on a Xiaomi Mi 9T Pro, I also tested it on the S10 + and it didn't happen, it seems that MiUI forces DarkMode ...
Thank you.

React Native version:

"react": "16.11.0",
"react-native": "0.62.2",

Possible solutions that I was unable to make work.

I found the following code below talking to put in the onCreate method of MainActivity.java, however it does not have this method there. I don't know where and how I can do it.
AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO)

[inferusvv]

MainApplication have onCreate method. But nothing changes. App still changes colors

[joan2404]

Same problem here... Same React and RN version. Added AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO);to onCreate() method on MainApplication.java and on Xiaomi the background color changes, which is very bad for the app as it relies on a pure white background. On other devices it works ok. Any clue to a fix?

[eliasjnior]

I also have the same problem. I'm running with Expo, also with Xiaomi devices something overrides my styles with Styled Components. Even the splash screen, that's an white SVG, is replaced by a black SVG.

[chrisglein]

Would it be possible to inhibit / prevent the device's Dark Mode from interfering with the colors of the app?

I'm certainly no expert on Android's dark mode support, but is there some top-level thing you can declare in the app that opts you out of this? Not a React Native things separately, but just something part of the Android platform that lets you opt out. It should be a standard scenario to have apps that aren't built to handle both light/dark mode and don't want the change in styling. I don't have that answer but maybe StackOverflow is a better resource here? Speak up if you think there's something specific to React Native that's going wrong here.

[github-actions[bot]]

We are using GitHub issues exclusively to track bugs in the core React Native library. Please try asking over on Stack Overflow as it is better suited for this type of question.

[joan2404]

With RN version 0.63.2 this issue is solved. Checked just now.

[ff-joaquin-rojas]

@joan2404 Tried that. It didn't work for me. Checked the changelog and saw there was nothing specific to dark mode on Xiaomi devices. What I have noticed is that it only affects icons and svgs.

[joan2404]

@ff-joaquin-rojas You're right, it could have been a temporary error of the device. I installed a new build with the latest react native and it worked fine, but after a reboot of the device the problem appeared again. However in my case the probem is with the background, it's pure white and it changes the color to black. Problem not fixed yet.

[RigottiG]

Same here w RN 0.63.2

[amerllica]

Dear @RBalconi, the exact solution to turn off the force dark mode on Android is this Stack Overflow post.

@RigottiG @joan2404 @ff-joaquin-rojas @eliasjnior @inferusvv

[ff-joaquin-rojas]

Dear @RBalconi, the exact solution to turn off the force dark mode on Android is this Stack Overflow post.

@RigottiG @joan2404 @ff-joaquin-rojas @eliasjnior @inferusvv

I don't know who you are or where you came from, but thank you, it works like a charm! You deserve all the best!

[amerllica]

@ff-joaquin-rojas, I'm Amer known as amerllica come from Iran, and actually, it is my pleasure, thank you ❤️ 🌹

[xXDeonoXx]

does anyone have a solution to a Expo application ? same issue here...

Edit: the only place i could get this error was Xiaomi MIUI 11.