4

I'm using Material Switch, and I know how to change the colors of the track and the thumb, but how do you change the color of the radiant shadow?

enter image description here

I have changed the color to purple, but when I tap on it, there is still that green shadow. I've tried styles, appcompat switch, etc but nothing worked.

Here is my code:

    <com.google.android.material.switchmaterial.SwitchMaterial
    android:id="@+id/switch_compat"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:trackTint="@color/purple_500"
    app:thumbTint="@color/purple_700"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

Thanks!

NearHuscarl
  • 66,950
  • 18
  • 261
  • 230
user2424380
  • 1,393
  • 3
  • 16
  • 29
  • Try this way may help you https://stackoverflow.com/questions/26138949/switch-track-color/36742528 – gpuser Nov 15 '21 at 15:00

1 Answers1

1

You can change the color of the ripple using

<item name="colorControlHighlight">@color/purple_700</item>

But you will need to define two styles for this either in styles.xml or themes.xml:

<style name="SelectableItemBackgroundBorderless">
    <item name="android:theme">@style/SelectableItemTheme</item>
    <item name="android:background">?attr/selectableItemBackgroundBorderless</item>
</style>

<style name="SelectableItemTheme">
    <item name="colorControlHighlight">@color/purple_700</item>
</style>

Then define style attribute for you switch:

 style="@style/SelectableItemBackgroundBorderless"

So your Switch will be:

<com.google.android.material.switchmaterial.SwitchMaterial
android:id="@+id/switch_compat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:trackTint="@color/purple_500"
app:thumbTint="@color/purple_700"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
style="@style/SelectableItemBackgroundBorderless" />

EDIT:

You can change the color of ripple on OFF state and ON state. No need to use the first style. Just define theme, no need to define style:

android:theme="@style/SelectableItemTheme"

Define in styles:

<style name="SelectableItemTheme">
    <item name="colorControlHighlight">@color/purple_500</item>
    <item name="colorControlActivated">@color/purple_700</item>
</style>
Antony Aiwin K X
  • 154
  • 2
  • 7
  • Thank you! You saved the day. May I ask you where did you find this? I was looking at the styles, but didn't notice this. – user2424380 Nov 15 '21 at 15:54
  • 1
    I don't remember it. but I have been using this style for a while. Must have found from another stackoverflow question... – Antony Aiwin K X Nov 15 '21 at 16:06