Attractive clear demo, helpful for the navigation and status bar details. But the tough problem remains unsolved, which is persisting the selected theme so that when a person selects dark the app *stays* dark across reboots and app stops; likewise light stays light. Not having persistence limits the utility of a theme change ... nobody wants to lose the theme across reboots, etc. especially when theme does more than just dark and light, e.g. a full palette. It's tough to solve persistence because you'd want to persist the theme on change (easy, just put it in AsyncStorage or something similar), then retrieve it on app start (tough because App is the parent component and any attempts to retrieve from storage take effect long after we need the value of the new theme. useEffect is the obvious approach, but it happens after App renders. And of course the App itself can't get a state as it does the wrapping with the context rather than is contained by the context. If you've solved that, or have ideas on it, I'd be most grateful and all ears.
Very usefull tutorial. I need dark theme to be stored on phone, so when a user closes the app it will remember whether the darktheme was on or off. And then on start displays the preferred theme. Now it is reset to default light theme. Any suggestion? I've looked into async storage in useeffect on load, but not working.
THANK YOU SO MUCH, Context Api Its so simple, now I get it!
thank you again
Awesome tutorial. Very easy to understand and apply. Hats off to you dear mate.
Thanks, it was pretty much what I was looking for.
HELLO is there we can fix the white flickering light when navigating screens in dark mode?
This is great! Other tuts use Redux which I think is overkill for switching themes.
Attractive clear demo, helpful for the navigation and status bar details.
But the tough problem remains unsolved, which is persisting the selected theme so that when a person selects dark the app *stays* dark across reboots and app stops; likewise light stays light. Not having persistence limits the utility of a theme change ... nobody wants to lose the theme across reboots, etc. especially when theme does more than just dark and light, e.g. a full palette.
It's tough to solve persistence because you'd want to persist the theme on change (easy, just put it in AsyncStorage or something similar), then retrieve it on app start (tough because App is the parent component and any attempts to retrieve from storage take effect long after we need the value of the new theme. useEffect is the obvious approach, but it happens after App renders. And of course the App itself can't get a state as it does the wrapping with the context rather than is contained by the context.
If you've solved that, or have ideas on it, I'd be most grateful and all ears.
I THINK ONE OF THE WAYS TO SOLVE THIS IS BY LEVERAGING AsyncStorage
Async Storage.
Excellent tutorial as usual. Quick question: can I setup the default header style in stack and change it as needed via setOptions within useEffect?
Thankssss so muchhhh
Very usefull tutorial. I need dark theme to be stored on phone, so when a user closes the app it will remember whether the darktheme was on or off. And then on start displays the preferred theme. Now it is reset to default light theme. Any suggestion? I've looked into async storage in useeffect on load, but not working.
We cover this concept in our "Build Offline Capable React Native Apps" course - www.reactnativeschool.com/building-offline-react-native-apps
This is so useful! Thanks for the effort
this is really handy thank you