Styling Android Preferences

Before you start copying code please consider that the example shown is probably not a best practice. It is one way of a few and could be considered hacky.

Recently I was tasked with styling our App’s Preferences . I am a lazy person and wanted a simple way to achieve my goal, while maintaining the functionality of PreferenceFragmentCompat . I am talking about keeping the automatic setting of my preferences title and summary and the persistence of their values in the SharedPreferences .

The first approach I was thinking of was styling the themes. But it took quite some time and I couldn’t figure out all necessary attributes. If someone has a comprehensive guide on how to do this with styles please leave a comment.

A colleague of mine recommended me to get rid of PreferenceFragmentCompat and just write the whole fragment with corresponding layout from scratch. But as I said I am lazy so I started playing around and did some more research. There is an android:widgetLayout attribute, which lets you set custom layout for the intractable parts of the preferences only. Not enough to satisfy our UX. Turned out that the Preference tags also have a android:layout attribute.

So I went forward and created my custom layouts. At first my layouts where there but no text was shown, nor the state of my switch was preserved when I restarted the App. So I went on and tried using the Android internally used ids

Which was rewarded with success. Title and summary of my custom PreferenceCategory where shown correctly. But the switch within the SwitchPreference was still not working although I have added a Switch element with an id I found while browsing some of the Android source code. So I started my layout inspector and analyzed the default layout. I found that the Switch was wrapped within a LinearLayout . So I added this element instead and Voila the switch appeared and also the persistence was working fine

We weren’t required to style the switch itself, but I assume this would work with the above mentioned android:widgetLayout attribute.

The last thing I needed to do was styling the background of my implementation of PreferenceFragmentCompat which is sadly not possible in the layout file, but has to be done in the Fragment class

Until now I was only required to style PreferenceCategory , Preference and SwitchPreference . But I assume other preferences will work in a similar way. The final result after adding some placeholders and playing with borders is looking quite alright in my opinion. At least it met our UX’s expectations.

You can find the sample code here.

What risks do you see in overwriting existing Android id’s? Which way did you choose to style your Preferences ? Leave a comment and tell me about your experiences.