Add a Toolbar to a PreferenceActivity

Posted by in Software

When trying to move a playground to Material Design, I stumbled upon the new Toolbar widget, which is supposed to replace the ActionBar (well, that’s my understanding from all the posts I’ve read). Thing is, the Toolbar is designed to be added to an Activity. To do that, the Activity class has a new method public void setActionBar (Toolbar toolbar) since API 21.

The problem

Adding the Toolbar to an activity is easy and documented in all sources implementing material design on github. However, Adding an action bar to a PreferenceActivity, is nowhere to be found. You can add a Toolbar alright, but PreferenceActivity has no setActionBar() method available.

My solution

My approach was to replicate the functionality of the ActionBar, particularly the menu interactions. What I needed was a way to display a menu (an About menu in my case) and trigger the relevant action on click.

I’ll split the implementation in two parts; the layout components and the Java implementation.

Layout

The layout has four parts:

  1. The menu: This is quite simple as I only require an About component:

    You may want to extend it to suit your needs.

  2. The toolbar: It has the empty toolbar:

  3. The preferences layout: It includes the toolbar and a ListView for the preferences:

  4. The Preferences components: In my case, I have a headers with multiple fragments:

The java implementation

As you can figure out from the above XML files, I intend to use a programmatic approach to enabling this functionality. It will involve a listener to the menu actions. To make my life easier, I’ll make my class implement the relevant listener:

Using butterknife, I’ll have a reference to the toolbar

All the UI is done in onPostCreate() (parts of it are from Jake Wharton’s U+2020). First, I’m setting up the preferences and enable ButterKnife:

Then I’m inflating the menu in the toolbar and register the listened to the toolbar itself:

Then, I’m implementing the listener method:

This way, when the About menu is clicked, the application will display a screen with about information, using Mike Penz’s awesome AboutLibraries.

This is it. You can customise the menu and its listener. You can probably include the toolbar layout in the preferences layout too but I haven’t tried it.

Alternatives

Depending on the complexity of your preferences, you may choose to bypass the PreferenceActivity class altogether and use Activity instead (like here, here, or here). This approach is definitely cleaner and easier, but it doesn’t offer the perks of PreferenceActivity with multiple fragments.

Another, hack-ier solution would be to implement your own PreferenceActivity similar to this implementation. I tried this variant but stopped after a couple of hours’ work.


A little experiment: If you find this post and ad below useful, please check the ad out :-)