Repository navigation
Status Bar Background #95
Description
Activity
The easiest way that I found is to monkey patch your status bar color like
<item name="colorPrimaryDark">#400101</item>into res/values/styles.xml's SplashScreen_SplashTheme from this library.Reacted by Shahzad and JaunTstatus bar is black and the icons are also black this issue still persists
Reacted by Andrés García Riverathis version works right:
"react-native-splash-screen": "^3.0.6"also add
<color name="primary_dark">#2b8ce5</color>this in colors.xmlIt works as long as you also change your
showmethod to include your custom style.From the README:
If you want to customize the color of the status bar when the splash screen is displayed:
Create
android/app/src/main/res/values/colors.xmland add<?xml version="1.0" encoding="utf-8"?> <resources> <color name="status_bar_color"><!-- Colour of your status bar here --></color> </resources>
Create a style definition for this in
android/app/src/main/res/values/styles.xml:<?xml version="1.0" encoding="utf-8"?> <resources> <style name="SplashScreenTheme" parent="SplashScreen_SplashTheme"> <item name="colorPrimaryDark">@color/status_bar_color</item> </style> </resources>
Change your
showmethod to include your custom style:SplashScreen.show(this, R.style.SplashScreenTheme);
Reacted by Paul Maribon-Ferret, Christos Lytras, Natalia Fernández, Andrew Zey, Alexander Chang, Jarred Nicholls, melone2018, Özgür, Noor Ul Haq, Pankaj Gupta and 47 moreReacted by Andrew Zey, Alexander Chang, Özgür, Pankaj Gupta, Johncy Arul A, Jason Safaiyeh, Duc Mai, Alauddin Afif Cassandra, Sami, Shahnawaz Hussain and 1 moreReacted by Andrew Zey, Alexander Chang, Kodie Grantham, Pankaj Gupta, Jan Ziemba, Aliaksei Astafyeu, Darkhan Suleimenov, Johncy Arul A, Jason Safaiyeh, Duc Mai and 10 moreReacted by Siddhartha Sarkar, Parth N Koshta, Shahnawaz Hussain, darshil-evolution and Abu MubaarakReacted by Andrew Zey, Alexander Chang, Pankaj Gupta, Amir Mohammad Moradi, Jason Safaiyeh, Duc Mai, TfADrama, Alauddin Afif Cassandra, Makar Kotlov, ovlis and 10 moreReacted by Jason Safaiyeh, Duc Mai, Genius Coder, Alauddin Afif Cassandra, Makar Kotlov, Peter Lin, Sami, Yeabsira Gashaw, yestay90, Gabriel Felipe and 5 moreReacted by Jason Safaiyeh, Duc Mai, Makar Kotlov and Shahnawaz HussainIt works as long as you also change your
showmethod to include your custom style.From the README:
If you want to customize the color of the status bar when the splash screen is displayed:
Create
android/app/src/main/res/values/colors.xmland add<?xml version="1.0" encoding="utf-8"?> <resources> <color name="status_bar_color"><!-- Colour of your status bar here --></color> </resources>Create a style definition for this in
android/app/src/main/res/values/styles.xml:<?xml version="1.0" encoding="utf-8"?> <resources> <style name="SplashScreenTheme" parent="SplashScreen_SplashTheme"> <item name="colorPrimaryDark">@color/status_bar_color</item> </style> </resources>Change your
showmethod to include your custom style:SplashScreen.show(this, R.style.SplashScreenTheme);
Hey @chico I got this error if I change my show method like this
Reacted by Yeison Betancourt S, Makar Kotlov, Ludo, Anuj Raghuvanshi, LydGol90, Rumion Apryano, Elin and Juan Villa@rizkiandrianto the symbol after the
R.style.<THEME_NAME>should match the name of the theme insidestyles.xmlin my case the name of the theme was
SplashTheme<resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <!-- Customize your theme here. --> </style> <style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="android:windowBackground">@drawable/background_splash</item> <item name="android:statusBarColor">@color/splash_background</item> </style> </resources>so I'm passing
R.style.SplashThemeto mySplashScreen.show()SplashScreen.show(this, R.style.SplashTheme);Reacted by Pankaj Gupta, Aliaksei Astafyeu, geethatulasi-nyros, Yeison Betancourt S, Simon Auer, Nikolai Papakha, Ethyaan, Sami, Aditya Trivedi, Rizki Andrianto and 1 moreReacted by Pankaj Gupta, Aliaksei Astafyeu, Sameera Madushan and SamiReacted by Pankaj Gupta, Aliaksei Astafyeu, Ozan, mbhuiayan, Eruvin and SamiFor some reason addid
SplashScreen.show(this, R.style.SplashTheme);causes white screen flash between splash screen and app mounting, any one facing the same issue or know a fix?Reacted by Amiya Panigrahi@RAMON90 i fixed the white screen with
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="android:statusBarColor">@color/bg</item> <item name="android:windowIsTranslucent">true</item> <--------- add this </style>Reacted by jsuryahyd and Simon Auer@RAMON90 i fixed the white screen with
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="android:statusBarColor">@color/bg</item> <item name="android:windowIsTranslucent">true</item> <--------- add this </style>This didn't resolve white screen flash between splash screen and app mounting
For some reason addid
SplashScreen.show(this, R.style.SplashTheme);causes white screen flash between splash screen and app mounting, any one facing the same issue or know a fix?were you able to solve this?
If none of this methods allow you to trick conversion error, add true as a third arg of show method like this
SplashScreen.show(this, R.style.SplashTheme, true);
Change it to false to disable fullscreenReacted by Habibur Rahaman, Artem Ivanychev, Zucci Daniel and RIAHI YassineReacted by Habibur RahamanReacted by Habibur Rahaman and Mouhib SahloulReacted by Habibur Rahaman and Zucci DanielI fixed this problem
I just addtrue
SplashScreen.show(this, true);Reacted by Mathieu Mousnier, RIAHI Yassine, Vekariya Nayan, darshil-evolution, XiaoPiHong and Juan VillaReacted by darshil-evolutionSomething might have changed in last versions of android.
This gives me an error telling that the second argument should be a boolean:
SplashScreen.show(this, R.style.SplashTheme);And this makes the statusBar and the navigationBar with the background color:
SplashScreen.show(this, true);Reacted by RIAHI Yassine, Vekariya Nayan, Evegeny, darshil-evolution and Juan VillaReacted by darshil-evolutionThanks for the solution, just a little change what I did is to add a third argument true (boolean value) in SplashScreen.show method
Is it possible to change the status bar color of the splashscreen?