New Android 12+ MaterialSwitch and androidx.preference

Question

So i'm updating my apps to fully support Monet and Material You guidelines, and the official site mentions a new design for the switches. I used it, and that's the result:

I have a preference screen using Androidx preferences library, latest version available at the time of writing, and the only way i found to theme the switches (except the manual theming, which makes no sense) is to use this line in the app's theme:

<item name="switchStyle">@style/Widget.Material3.CompoundButton.MaterialSwitch</item>

And using SwitchPreferenceCompat (it doesn't work in the regular SwitchPreference) this is what i get:

Regardless of the width (which is different, but can be changed) the disabled state is completely different and doesn't match the rest of the app. Why? and most importantly, why do they suggest to use a library which:

1. Doesn't support Material You out of the box
2. Doesn't support any new Material3 component
3. It's hard to properly customize in general

?

I don't want to be too critical, but this is out of my understanding.

EDIT: at the moment, i'm using switchCompat everywhere, to make the app uniform. Looking at the system apps, i can find 4 different type of switches: a custom switch similar to the second screenshot, the old one and the two types in this question. That's hella confusing.

Siberia

I cannot comment due to low karma, but I just wanted to let you know I have filed a bug report to Google about this on their IssueTracker: issuetracker.google.com/issues/247430819 It's been assigned, so hopefully it will get fixed soon. – Writhe

Answer 1

I understand Google stance on this, they don't want to make androidx.* packages dependent to Material library itself, maybe they should provide a separate preference package but this time with fully Material widgets.

In order to have the brand new MaterialSwitch of Material 1.7.0 with preference, I've overridden its widgetLayout with a custom layout by android:widgetLayout="@layout/preference_material_switch" (in fact I applied that programmatically like .widgetLayoutResource = R.layout.preference_material_switch) and put the following on preference_material_switch.xml layout file,

<?xml version="1.0" encoding="utf-8"?>
<!-- Derived from https://github.com/androidx/androidx/blob/8cb282cc/preference/preference/res/layout/preference_widget_switch_compat.xml -->
<com.google.android.material.materialswitch.MaterialSwitch xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/switchWidget"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@null"
    android:clickable="false"
    android:focusable="false" />

Update: Alternative solution rather than adding android:widgetLayout= to each switch is to add the following to your base theme,

         <item name="preferenceTheme">@style/AppPreferenceThemeOverlay</item>

Then adding the following styles also,

    <style name="AppPreferenceThemeOverlay" parent="@style/PreferenceThemeOverlay">
        <item name="switchPreferenceCompatStyle">@style/AppSwitchPreference</item>
    </style>

    <style name="AppSwitchPreference" parent="@style/Preference.SwitchPreferenceCompat.Material">
        <item name="widgetLayout">@layout/preference_material_switch</item>
    </style>

And here is the result,

Hiltner

This is a bad solution as the title doesn't show at all. – Writhe

You've probably overridden layout instead widgetLayout as this solution shows the title here for weeks with no issue. – Hiltner

My mistake, your solution does indeed work. – Writhe

Well, i don't like to override stuff normally, but seems like that's my only option as of now. Thanks! – Siberia

Notice for everyone, remember to use SwitchPreferenceCompat or it will not work! – Keelby

Thaks a lot ! I've been trying to get this result since yesterday. Tried a lot of "official" way with theme configuration without luck. You saved me – Eloquent

Answer 2

The same problem, After seeing these replies, I'm thinking to build the settings fragment without androidx.preference.

MKevin3 said:

I hate the provided Android preferences setup and look. So many times they changed the rules and broke what I had.

Not that this helps you probably but I just did my own to avoid all the headaches and I am in full control of the look. If push comes to hove you might consider doing this as well instead of fighting the "Android Way".

sc00ty said:

I gave up trying to use their widgets and fragments. It was so much less of a headache to spend a little time making my own compound widgets for each setting type.

Tattler

That's true, but in this particular case we also have a difference between the material3 switch and the material3 components switch, independently from the library. And, again, that's terribly confusing – Siberia