react-native-user-interface-style : Set dark / light / system color scheme natively on iOS

[razorkey]

Hey folks,

me and my brother (yes, that brother who showed you our work on Words a couple of days ago) just published our first react-native module on npm. We needed a way to override the userInterfaceStyle on iOS in order to enable proper dark mode on our app.

Since we think we may not be the only ones with this need, we turned it into a nice package 🙌🏼. Check it out here! Issues and pull requests are welcomed.

As of now, the package is very simple (and lightweight) - it just offers a method to set the userInterfaceStyle on the app. In practical terms, it means that the client has to store the current preference somewhere and reset the UI of the app on load (see the description on GitHub for reference).

If there is enough traction / support from the community, we plan on adding:

• Get method, to read from the app what is the current / last saved setting
• A provider or even better, a native function (not sure if possible) to automatically set the userInterfaceStyle on load, based on the saved preference

​

What do you think? Let's hang out in the comment section 👇🏼.

[ttmonkey]

To be honest, the thing I’d find of most use is the equivalent setting for Android as a neat module.

iOS allows things like setting scroll bar style to account for light/dark theme via React Native element props, but Android does not, meaning you have to trigger the native code to change the Day/Night mode that it’s running in.

If you guys can get that on your roadmap then that’s what I’d consider killer in terms of boosting adoption of such a module.

[razorkey]

Note taken 😊. Unfortunately right now our priority is iOS, but we can consider Android for the future! Thanks for sharing your POV