reactjsreact-nativenativedarkmodelightmode

How can I add a DarkMode in React Native?


I am just new to React-Native and I want to build a school app for my school project.

And one of the features in the app should be dark/light mode. I have seen a few videos about the topic, but none of them meet my requirements.

It should be a nice button that doesn't switch directly, but, the switch should go nicely to the right or left. (Like on the iPhone)

This button is first for whether it chooses mode set by the system or if the user wants to set extra for the app.

If the button is not switched on, it remains with the system set mode, but if the button is switched on, a 2nd button comes, where it is then asked which mode the user wants.

I am new to the site, so I don't know if the information is enough for you, but I would add more stuff if asked.


Solution

  • For DarkMode you can use https://reactnative.dev/docs/appearance . React-Native also provides https://reactnative.dev/docs/switch . With this you an create such a case.