Xamarin.Forms - change color of StatusBar

Question

I am looking, but I can’t find, is it possible to change the StatusBar color for each plate shape, from my portable code? (for Android, iOS & WinPhone 8.1 )

 public App() { // Change the StatusBar color MainPage = new MainPageUser(); } 

Thanks!

Answer 1

It is pretty simple.

Quick response

Just add this line

 MainPage.SetValue(NavigationPage.BarBackgroundColorProperty, Color.Black); 

Or, if you inherit from NavigationPage, you can do this with

 BarBackgroundColor = Color.Black; 

---

Detailed answer You have two options. Let's look at them.

Option 1

 public App() { MainPage = new MainPageUser(); //Background color MainPage.SetValue(NavigationPage.BarBackgroundColorProperty, Color.Black); //Title color MainPage.SetValue(NavigationPage.BarTextColorProperty, Color.White); } 

Option 2

 public App() { MainPage = new MainPageUser(); } public class MainPageUser : NavigationPage { public MainPageUser((Page root) : base(root) { // Background color BarBackgroundColor = Color.Black; //Title color BarTextColor = Color.White; } } 

But, as you probably noticed now, the status bar in iOS on top is also black and that you will need to change the Info.plist file in your ios project and open it (right-click and select "open with") using the editor xml and add these lines of code

 <key>UIStatusBarStyle</key> <string>UIStatusBarStyleLightContent</string> <key>UIViewControllerBasedStatusBarAppearance</key> <false/> 

Answer 2

I believe that you better write some code for a specific platform:

For Android:

On your MainActivity.cs in the Droid project, right after

 LoadApplication(new App()); 

Override OnCreate method, add:

 Window.SetStatusBarColor(Android.Graphics.Color.Argb(255, 0, 0, 0)); 

Same:

 protected override void OnCreate(Bundle bundle) { TabLayoutResource = Resource.Layout.Tabbar; ToolbarResource = Resource.Layout.Toolbar; base.OnCreate(bundle); global::Xamarin.Forms.Forms.Init(this, bundle); LoadApplication(new App()); Window.SetStatusBarColor(Android.Graphics.Color.Argb(255, 0, 0, 0)); //here } 

Answer 3

Another option for Android: change the color in the \Resources\values\styles.xml (Android project).

 <item name="colorPrimaryDark">#00FF00</item> 

Answer 4

Maybe I do not understand the question, but I hope this helps.

After searching around quite a bit, trying to figure out how to change the iPhoneX color status bar (slightly behind the cutout), I found that it is automatically set based on the BackroundColor property of the ContentPage root.

So in Xaml it is so simple:

  <ContentPage.BackgroundColor> <OnPlatform x:TypeArguments="Color" iOS="Navy" Android="Yellow" /> </ContentPage.BackgroundColor> 

I mainly use the approach described in one of the answers: fooobar.com/questions/561361 / ... , but changing it a bit, giving you a piece of code that I focused on your individual question (at least I think!)

Answer 5

Using this approach, you can change it on every page.

 Application.Current.MainPage.SetValue(NavigationPage.BarBackgroundColorProperty, Color.Black);