Menu
I just got started with React Native for Android, and I'm trying to figure out if there's a way to change the status bar color for Android...
Like this?
917
Step 1: After opening the android studio and creating a new project with an empty activity. Step 2: Navigate to res/values/colors. xml, and add a color that you want to change for the status bar.
Add import { StatusBar } from 'react-native'; to the top of your app. js and then add StatusBar. setBarStyle('light-content', true); as the first line in your render() to change the status bar text/icons to white.
React Native StatusBar PropsIt is used to hide and show the status bar. By default, it is false. If hidden = {false} it is visible, if hidden = {true}, it hide the status bar. It sets the background color of the status bar.
Just go to res/values/styles.edit the xml file to change the color of action bar.
You can use React Native Status Bar(detailed description here). All you need to do is wrapping navigator with a view and adding a StatusBar component above it. Don't forget to import StatusBar from 'react-native' package.
<View> <StatusBar backgroundColor="blue" barStyle="light-content" /> <Navigator initialRoute={{statusBarHidden: true}} renderScene={(route, navigator) => <View> <StatusBar hidden={route.statusBarHidden} /> ... </View> } /> </View> One thing I've noticed is that you should style the parent View with flex:1, without it you'll just see a white blank screen. It's not mentioned in RN Documents though.
171
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
