Material Preference

Material theme for preference widgets.

Backporting dat material look and functionality.

Available from API 9. Connecting preference-v7 to appcompat-v7.

Table of contents

• How to get the library?
• Screenshots
• Contents
• How to use the library?
• Changelog

How to get the preference library?

dependencies {

  compile 'net.xpece.android:support-preference:1.3.1'

 ext.supportLibsVersion = "26.1.0"
  compile "com.android.support:appcompat-v7:$supportLibsVersion"
  compile "com.android.support:preference-v7:$supportLibsVersion" 
}

Always specify preference-v7 version explicitly!

Version 1.3.0 is compatible with support libraries down to 23.2.0.

How to get color picker preference too?

dependencies {

  compile 'net.xpece.android:support-preference-color:1.3.0' 
}

How to get just custom Material popup menu and spinner?

dependencies {

  compile 'net.xpece.android:support-spinner:1.3.0' 
}

• Preference
• CheckBoxPreference
• SwitchPreference
  • Using SwitchCompat available from API 7
• DialogPreference
  • Uses AppCompat AlertDialog Material theme
• EditTextPreference
• ListPreference
  • Optionally can display as a simple menu or simple dialog.
  • Subclasses support custom adapter.
• MultiSelectListPreference
  • Available since API 7
• SeekBarDialogPreference extends DialogPreference
  • Made public
• SeekBarPreference
  • Made public
  • According to http://www.google.com/design/spec/components/dialogs.html#dialogs-confirmation-dialogs
• RingtonePreference
  • Coerced Ringtone Picker Activity from AOSP
• XpPreferenceFragment
  • Handles proper Preference inflation and DialogPreference dialogs
• SharedPreferencesCompat
  • getStringSet and putStringSet methods allow persisting string sets even before API 11
• XpPreferenceManager
  • setDefaultValues method takes into account preference classes in custom packages
• XpPreferenceHelpers
  • Tinted icons and text appearance support for preferences outside of this library

Support color preference

• ColorPreference
  • Pillaged http://www.materialdoc.com/color-picker/

Support spinner

Spinner, popup menu and adapters behaving according to Material Design specs. Read https://www.google.com/design/spec/components/menus.html#menus-behavior.

• XpAppCompatSpinner
  • Spinner variant that uses simple menu or simple dialog.
• XpListPopupWindow
  • Popup window that supports minimum distance from edges, multiple size measuring modes, ListView padding etc.
• CheckedTypedItemAdapter<T>
  • ListAdapter plus SpinnerAdapter that highlights one item.
  • Open methods for converting T to CharSequence.
  • Allows different string representations for selected spinner item and drop down menu.

Features on top of preference-v7

• Using appcompat-v7 features.
• Material preference item layouts out of the box.
• Icon and dialog icon tinting and padding.
• EditTextPreference understands EditText XML attributes.
  • Use EditTextPreference.setOnCreateEditTextListener(OnCreateEditTextListener) to setup your input field.
• Several preference widgets not publicly available in preference-v7 or SDK.
  • RingtonePreference, SeekBarPreference, SeekBarDialogPreference, MultiSelectListPreference
• Subscreen navigation implementation.
• ListPreference can optionally show as a simple menu in a popup instead of a dialog.
• ColorPreference
• Preference long click listeners.
• Title/summary text color and text appearance defined in Java or XML.

public void onCreatePreferences2(final Bundle savedInstanceState, final String rootKey) {

  // ... 
}

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <!-- Used to theme preference list and items. -->
  <item name="preferenceTheme">@style/PreferenceThemeOverlay.Material</item>
  <!-- Default icon tint for preferences. -->
  <item name="asp_preferenceIconTint">?colorAccent</item>
  <item name="asp_preferenceDialogIconTint">?asp_preferenceIconTint</item> </style>

@Override public void onViewCreated(View view, Bundle savedInstanceState) {

  super.onViewCreated(view, savedInstanceState);

  getListView().addItemDecoration(new PreferenceDividerDecoration(getContext()).drawBottom(true));

  setDivider(null);
 
}

Simple menu is described in Material Design specs.

If you want to show your ListPreference in a popup instead of a dialog use this configuration:

<ListPreference
  style="@style/Preference.Material.DialogPreference.ListPreference.SimpleMenu"/>

Above code will ensure that:

• If all items fit on one line a popup window is shown.
• Otherwise a simple dialog is shown.
• Popup window width will round up to nearest multiply of 56dp on phones and 64dp on tablets.

These are the attributes and values for manual setup:

Material Spinner

New XpAppCompatSpinner widget is built according to Material Design specs.

Menus are positioned over their emitting elements such that the currently selected menu item appears on top of the emitting element.

Example setup:

<net.xpece.android.support.widget.XpAppCompatSpinner
  style="@style/Widget.Material.Spinner.Underlined"
  android:theme="ThemeOverlay.Material.Spinner"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:entries="@array/my_entries"
  app:asp_spinnerMode="dialog|dropdown|adaptive"/>

The above setup will ensure the following:

• Popup ListView will have top and bottom padding.
  • Theme overlay applied via android:theme directly limits its effects on this widget.
  • Is not supported by AppCompat or platform popup windows.
• Spinner will have proper space around its caret before API 23.
  • If using style="@style/Widget.Material.Spinner" or style="@style/Widget.Material.Spinner.Underlined".

If you need to alter entries programmatically create by CheckedItemAdapter.newInstance(Context, CharSequence[], int) or supply your own adapter (responsible for its own styling) to XpAppCompatSpinner.setAdapter(SpinnerAdapter).

Color preference

Version 0.6.0 introduced color preference as a separate module. An example would look like this:

<ColorPreference
  android:defaultValue="?colorPrimary"
  android:entries="@array/colors_material_names"
  android:entryValues="@array/colors_material"
  android:key="notif_color"
  android:title="Notification color"/>  <array name="colors_material">

<item>@color/material_red_500</item>

<item>@color/material_light_blue_500</item>

<item>@color/material_light_green_500</item>

<item>@color/material_orange_500</item> </array>  <string-array name="colors_material_names">
  <item>Red</item>
  <item>Light Blue</item>
  <item>Light Green</item>
  <item>Orange</item> </string-array>

Attributes include:

Finally you need to make your preference fragment fire up the color picker dialog when the preference is clicked and optionally update summary when a color is chosen. Please review sample SettingsActivity.java and SettingsFragment.java respectively.

If you need to change the default style either use style attribute or override it in your theme:

<item name="colorPreferenceStyle">@style/Preference.Material.DialogPreference.ColorPreference</item>

The color is stored internally as a 32-bit integer.

Subscreen navigation

Possible solution is implemented in PreferenceScreenNavigationStrategy.ReplaceFragment class. This class will help you replace the whole preference fragment with a new instance with specified root preference. It is using fragment transactions and back stack allowing for transition animations and saved states.

Known issues with support library

In appcompat-v7 r23.1.1 and r24.1.x there is a bug which prevents tinting of checkmarks in lists. Call Fixes.updateLayoutInflaterFactory(getLayoutInflater()) right after super.onCreate(savedInstanceState) in your Activity.

@Override protected void onCreate(Bundle savedInstanceState) {

  super.onCreate(savedInstanceState);

  Fixes.updateLayoutInflaterFactory(getLayoutInflater());

  setContentView(R.layout.activity_settings);

  //... 
}

You may have experienced unexpected background color which manifests as holo blue on Android 4 and grey on Android 5. This is caused by PreferenceFragment's RecyclerView grabbing focus on fragment start. We can disable this behavior while still being able to navigate between individual preferences with a D-pad.

@Override public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {

  super.onViewCreated(view, savedInstanceState);

  final RecyclerView listView = getListView();

// We don't want this. The children are still focusable.
  listView.setFocusable(false);
 
}
 

Icon tinting

All preferences:

• app:asp_tint
• app:asp_tintMode
• app:asp_tintEnabled

All dialog preferences:

• app:asp_dialogTint
• app:asp_dialogTintMode
• app:asp_dialogTintEnabled

Icon padding

Application icons (48dp x 48dp) require no extra padding. For smaller icons extra padding of 4dp on each side is needed. Achieve this by using app:asp_iconPaddingEnabled and app:asp_dialogIconPaddingEnabled attributes. Icon padding is enabled by default.

Handling PreferenceScreen icons

As PreferenceScreen class is final and hardwired into preference system I was unable to automate icon tinting and padding. However you are able to do this yourself:

Preference subs = findPreference("subs_screen");
 PreferenceIconHelper subsHelper = new PreferenceIconHelper(subs);
 subsHelper.setIconPaddingEnabled(true);
 // Call this BEFORE setIcon! subsHelper.setIcon(R.drawable.some_icon);
 subsHelper.setTintList(AppCompatResources.getColorStateList(subs.getContext(), R.color.accent));
 subsHelper.setIconTintEnabled(true);
 /* or */ PreferenceIconHelper.setup(subs /* preference */,
  R.drawable.some_icon /* icon */,
  R.color.accent /* tint */,
  true /* padding */);

You can use this class even on preference classes from preference-v7 package in case you're not using XpPreferenceFragment.

Proguard

Since version 0.5.1 Proguard rules are bundled with the library.

Changelog

See CHANGELOG.md.

Known issues

• MultiSelectListPreference items may be incorrectly tinted on Android 2.
  • Observed on Android 4 as well on first opening of multi select dialog.
• Custom spinner animation is not smooth on Android 6+.

Questions

• Why are some of your classes in android.support.v7 packages?
  • I'm using their package private features to achieve consistent results with AppCompat.

TODO

• Compute simple menu preferred position with prompt enabled.
• ListPreference scroll to viewport before renewing popup/dialog.
• ColorPicker XML attributes.
• Use ForwardingListener.

Credit

Most of this library is straight up pillaged latest SDK mixed with heavy reliance on appcompat-v7. Since version 0.5.0 the same applies to preference-v7. Kudos to people who create and maintain these!