unable to use custom theme in android xamarin.forms app

pierre-louis deschamps 146

Hello, I am struggling for many hours.

I followed every step described here:
https://learn.microsoft.com/en-us/xamarin/android/user-interface/material-theme
and here:
https://www.serkanseker.com/xamarin-material-design-theme/

But I am unable to change navigationBarColor nor statusBarColor.

This is styles.xml:

<?xml version="1.0" encoding="utf-8" ?>  
<resources>  
  <style name="AlmicantaratTheme" parent="@android:Theme.Material">  
      <item name="android:windowNoTitle">true</item>  
      <item name="android:windowActionBar">false</item>  
      <item name="android:colorPrimary">#15014E</item>  
      <item name="android:colorPrimaryDark">#15014E</item>  
      <item name="android:navigationBarColor">#15014E</item>  
      <item name="android:statusBarColor">#15014E</item>  
      <item name="android:colorAccent">#FF4081</item>  
      <item name="android:windowActionModeOverlay">true</item>  
  </style>  
</resources>

styles.xml is in Almicantarat.Droid/Resources/values-v21
I tried to put it in Almicantarat.Droid/Resources/values too.

this is AndroidManifest.xml:

<?xml version="1.0" encoding="utf-8"?>  
<manifest xmlns:android="http://schemas.android.com/apk/res/android" android:installLocation="preferExternal" package="almicantarat.almicantarat" android:versionCode="17" android:versionName="1.3.0">  
 <uses-sdk android:minSdkVersion="21" android:targetSdkVersion="29" />  
 <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />  
 <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />  
 <uses-permission android:name="android.permission.INTERNET" />  
 <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />  
 <application android:label="Almicantarat"  
               android:icon="@drawable/almicantarat_launcher"  
  android:theme="@style/AlmicantaratTheme">  
 <meta-data android:name="com.google.android.geo.API_KEY" android:value="********************" />  
 <meta-data android:name="com.google.android.gms.version" android:value="@integer/google_play_services_version" />  
 <uses-library android:name="org.apache.http.legacy" android:required="false" />  
 </application>  
</manifest>

Java jdk is jdk1.8.0_271
Android 5.0 - Lollipop Android SDK Platform 21 is installed

And this is the result:

What is going wrong? Why does navigationBarColor remain white on the screenshot? and why does colorPrimary remain black?

Regards,

Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,656 Reputation points Microsoft Vendor

2021-09-23T02:58:39.127+00:00

You post two times about AndroidManifest.xml, please post your AlmicantaratTheme style. If you want to change the statusbar's color, you can add <item name="android:statusBarColor">@color/colorAccent</item> to your AlmicantaratTheme
pierre-louis deschamps 146 Reputation points

2021-09-23T08:25:30.027+00:00

@Leon Lu (Shanghai Wicresoft Co,.Ltd.) you are right. I made a mistake by posting twice AndroidManifest.xml.
I have edited my post.
Regards

Accepted answer

Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,656 Reputation points Microsoft Vendor

2021-09-23T09:48:57.007+00:00
Hello,

Welcome to our Microsoft Q&A platform!

I test it, I get the same result, If you want to change the color of navigationBarColor, you can add following code to OnCreate method of MainActivity.cs

public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity { protected override void OnCreate(Bundle savedInstanceState) { base.OnCreate(savedInstanceState); Xamarin.Essentials.Platform.Init(this, savedInstanceState); global::Xamarin.Forms.Forms.Init(this, savedInstanceState); // add here if (Build.VERSION.SdkInt >= BuildVersionCodes.Lollipop) { Window.SetStatusBarColor(Android.Graphics.Color.Orange); Window.SetNavigationBarColor(Android.Graphics.Color.Orange); } LoadApplication(new App()); }

Best Regards,

Leon Lu

If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.
Please sign in to rate this answer.
pierre-louis deschamps 146 Reputation points

2021-09-23T12:34:56.39+00:00

hello @Leon Lu (Shanghai Wicresoft Co,.Ltd.) , thank you for your answer.

That is a good work around which works for me.
As I looked at MainActivity I saw this attribute:

[Activity (Label = "Almicantarat", Theme = "@style/MainTheme", Icon = "@drawable/almicantarat_launcher", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation)] public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity {

So I removed:

Theme = "@style/MainTheme",

But then I met the following exception:

Android.Views.InflateException
Message=Binary XML file line #1 in almicantarat.almicantarat:layout/toolbar: Binary XML file line #1 in almicantarat.almicantarat:layout/toolbar: Error inflating class androidx.appcompat.widget.Toolbar

I guess I have to go through that post:
https://devblogs.microsoft.com/xamarin/android-tips-hello-appcompatactivity-goodbye-actionbaractivity/
but I am not sure, this post seems to be too old...

Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,656 Reputation points Microsoft Vendor

2021-09-24T08:56:31.873+00:00

Becuase you test android device or emlator is not Android 5.0, You set the values-v21 it just be used in the Android 5.0, If you use other version of emulator, you should put AlmicantaratTheme theme to the styles.xml of values folder.

Please open the styles.xml in values folder, add following style.

<style name="AlmicantaratTheme" parent="@android:Theme.Material"> <item name="android:windowNoTitle">true</item> <item name="android:windowActionBar">false</item> <item name="android:colorPrimary">#15014E</item> <item name="android:colorPrimaryDark">#15014E</item> <item name="android:navigationBarColor">#15014E</item> <item name="android:statusBarColor">#15014E</item> <item name="android:colorAccent">#FF4081</item> <item name="android:windowActionModeOverlay">true</item> <item name="android:statusBarColor">@color/colorAccent</item> </style>

Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,656 Reputation points Microsoft Vendor

2021-09-24T08:57:32.397+00:00

You can test above style
Sign in to comment

1 additional answer

pierre-louis deschamps 146 Reputation points

2021-09-24T14:45:41.797+00:00

Hello @Leon Lu (Shanghai Wicresoft Co,.Ltd.)

I moved my style.xml to values file: Same exception.

I start a new thread as it is no more a custom theme issue but it seems to be more a toolbar issue.

Regards
Please sign in to rate this answer.

0 comments No comments
Sign in to comment