0
votes

In my Xamarin Forms Android Project I need to change the ToolBar Title color and background color I have tried with many workarounds suggested in Google but unfortunately I am unable to find the correct solution to me

What I Need is

enter image description here

What I am getting Now is enter image description here

by using below codes

MainActivity.cs

[Activity(Label = "Sample.Droid", Icon = "@mipmap/icon_launcher", Theme = "@style/MyTheme")]
    public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity
    {
            protected override void OnCreate(Bundle bundle)
            {
                base.OnCreate(bundle);

                global::Xamarin.Forms.Forms.Init(this, bundle);          

                LoadApplication(new App());
            }   


    }

styles.xml

    <?xml version="1.0" encoding="UTF-8"?>
<resources>

    <style name="MyTheme" parent="MyTheme.Base">
    </style>

    <style name="MyTheme.Base" parent="Theme.AppCompat.NoActionBar"> 

        <item name="windowNoTitle">true</item>     
        <item name="windowActionBar">false</item>    
        <item name="colorPrimary">#cc66ff</item>  
        <item name="colorPrimaryDark">#1976D2</item>          
        <item name="colorAccent">#FF4081</item>  

    </style>

Toolbar.axml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#cc66ff"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    android:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

What I have tried

I have tried to change the android:background in Toolbar.xaml but it doesn't have any impact on it;it is always displaying Dark background in Toolbar

and also I tried with this below code too in MainActivity.cs this hides the title in the Toolbar

 var toolbar = FindViewById<Toolbar>(Resource.Id.toolbar);             
              SetSupportActionBar(toolbar);

anyone please guide me to resolve this issue and make me get what I need Thanks in advance

1
In your OnCreate method, where is TabLayoutResource = Resource.Layout.Tabbar;ToolbarResource = Resource.Layout.Toolbar; ? Have you forgot that?Robbit
@JoeLv-MSFT Thanks to remember, I have added ToolbarResource = Resource.Layout.Toolbar; this line in OnCreate() then I am getting what I need except Back button. Tool bar background color and title colorhave changed but back button is still in black color.Jamal
Hi, still can't change the back button's color?Robbit

1 Answers

1
votes

In you app class (PCL), add these to change the back button's color:

NavigationPage naviPage =  new NavigationPage( new App13.MainPage());
MainPage = naviPage;
naviPage.BarBackgroundColor = Color.FromHex("#cc66ff");

I have made a demo for you.

Update:

From here, like @MarlonRibeiro has said, you can use drawerArrowStyle to change the back button's color to white(I have updated my project on github):

 <style name="MainTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
    </style>
<style name="DrawerArrowStyle" parent="@style/Widget.AppCompat.DrawerArrowToggle">
    <item name="color">#FFFFFF</item> 
</style>