I can't set the color of an Android switch in Xamarin.Forms with Styles

Question

I am using the following XML to try and change the colors of a switch in my Xamarin forms application. However nothing changes.
Can anyone give me any advice on what I might be doing wrong:

<style name="MyTheme" parent="MyTheme.Base">
</style>
<!-- Base theme applied no matter what API -->
<style name="MyTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">      
    <item name="windowActionBar">false</item>
    <item name="android:actionBarSize">45dp</item>
    <item name="colorPrimaryDark">#1976D2</item>
</style>

<style name="MyTheme.Switch" parent="Widget.AppCompat.CompoundButton.Switch">
    <item name="colorControlActivated">#FF0000</item>
    <item name="colorControlNormal">#FF0000</item>
    <item name="colorControlHighlight">#FF0000</item>
    <item name="colorSwitchThumbNormal">#FF0000</item>
    <item name="colorAccent">#FF0000</item>
 </style>

Here's a clip from MainActivity.cs

 [Activity(Label = "Japanese", Icon = "@drawable/Icon120", Theme = "@style/MyTheme", MainLauncher = true, 
          ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation,
          ScreenOrientation = ScreenOrientation.Portrait)]

As this didn't work I tried some changes but same problem in that it doesn't work:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="CustomTheme" parent="@android:style/Theme">
        <item name="segmentedControlOptionStyle">@style/SegmentedControlOption</item>
        <item name="switchStyle">@style/SwitchCompat</item>
    </style>
</resources>

<style name="SwitchCompat" parent="@style/Widget.AppCompat.CompoundButton.Switch">
    <item name="colorPrimary">#FFFF00</item>
    <item name="colorPrimaryDark">#00FFFF</item>
    <item name="colorAccent">#FF00FF</item>
</style>

Have you tried to set a style, by passing it to the MainActivity? Like explained here: https://forums.xamarin.com/discussion/70907/forms-switch-doesnt-look-like-i-expected-on-android — Hichame Yessou, Jul 07 '18 at 12:38
https://stackoverflow.com/questions/46157966/when-toggled-and-disabled-android-switch-is-all-greyed-out/46159563#46159563 — SushiHangover, Jul 07 '18 at 16:53

gannaway · Accepted Answer · 2018-07-09T22:07:51.840

The MyTheme.Switch style does not automatically get applied to all switches. If the colorAccent is moved inside MyTheme.Base, then it can change the tint color (note colorAccent applies to other widgets as well):

<style name="MyTheme" parent="MyTheme.Base">
</style>
<!-- Base theme applied no matter what API -->
<style name="MyTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">      
    <item name="windowActionBar">false</item>
    <item name="android:actionBarSize">45dp</item>
    <item name="colorPrimaryDark">#1976D2</item>
    <!-- colorAccent is used as the default value for colorControlActivated which is used to tint widgets -->
    <item name="colorAccent">#FF0000</item>
</style>

A custom renderer will allow more control over the styling. The following custom renderer can be used to reference your custom style (note you'll want to replace PanDemo.Droid with your namespace).

[assembly: Xamarin.Forms.ExportRenderer(
    typeof(Xamarin.Forms.Switch), 
    typeof(PanDemo.Droid.CustomSwitchRenderer))]

namespace PanDemo.Droid
{
    public class CustomSwitchRenderer : Xamarin.Forms.Platform.Android.SwitchRenderer
    {
        public CustomSwitchRenderer(Android.Content.Context context)
            : base(context) { }

        protected override Android.Widget.Switch CreateNativeControl()
        {
            return new Android.Widget.Switch(
                new Android.Views.ContextThemeWrapper(
                    this.Context, 
                    Resource.Style.MyTheme_Switch /* <- Custom Switch Style */));
        }
    }
}

Then just modify your custom style as necessary, for example:

<style name="MyTheme.Switch" parent="Widget.AppCompat.CompoundButton.Switch">
    <item name="colorAccent">#008000</item>
</style>

Thanks, Is there a way to just apply the red color to switches? I looked at custom renderers before but only have the need for just the switch color and I had problems trying to do that. — Alan2, Jul 07 '18 at 13:20
@Alan2, I added a sample custom renderer that may meet your needs — gannaway, Jul 07 '18 at 14:20

score 1 · Answer 2 · answered Oct 10 '19 at 09:50

In visual studio check your android project and find this file:

Resources -> values -> styles.xaml

There you can change the wanted color in this item:

<item name="colorAccent">#3c94c7</item>

This will change "colorAccent" from your Android theme.

You cant find more about the colorAccent in here

I can't set the color of an Android switch in Xamarin.Forms with Styles

2 Answers2