NavigationBar colors in Xamarin.Forms

Hello,

This article will explain to you How change the navigation Bar Color in xamarin.forms. Xamarin has allowed us to control that from the PCL level itself. But earlier I recall it was pretty complex where we had to write custom renderers and stuff.

Now you can do it in C# or in XAML.

First things : The properties for this job, BarBackgroundColor, and BarTextColor. 

Let’s do it in XAML ! 

To set Property in XAML it’s easy. You simply put those values in your global Style level, so when the app is running it will fetch them from those values and set it to the navigation bar.

<App.Resources>
    <ResourceDictionary>
      
      <!-- Styles -->
      <Style TargetType="NavigationPage">
        <Setter Property="BarBackgroundColor" Value="#0087BE"/>
        <Setter Property="BarTextColor" Value="White"/>
      </Style>
      <!-- Styles -->

	</ResourceDictionary>
  </App.Resources>

 

Now in C# !

You just need to put in the App builder. this code :

public App()
{
	MainPage = new NavigationPage(new Page1())
	{
		BarBackgroundColor = Color.FromHex("#ff5300"),
		BarTextColor = Color.White,
	};
}

That’s it . I hope it will be helpfull..

Regards

Jonathan

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s