Delightful Detail Drawables

This wiki highlights the features of the Delightful Detail Drawables included with this library. The animations are all taken from the Delightful details section of the Material Design guidelines, and the corresponding Drawables in this library provide a ready-to-use implementation of those which you can use to spice up your application a bit.

1. MediaControlDrawable

The MediaControlDrawable tries to mimick the animation presented in the guidelines as closely as possible. It's easy to build and can be configured any way you like it. Here's an example of how you would go about creating a new MediaControlDrawable:

final MediaControlDrawable drawable = new MediaControlDrawable.Builder(this)
        .setColor(Color.WHITE)
        .setPadding(8 * dp)
        .setInitialState(MediaControlDrawable.State.PLAY)
        .build();
// Use this drawable in an ImageView
mImageView.setImageDrawable(drawable);

You can then later change the state of the MediaControlDrawable (which will animate to the proper icon), in two different ways, depending on what you personally prefer:

// Calling setMediaState on the final variable drawable
drawable.setMediaState(MediaControlDrawable.State.PAUSE);
// Calling setMediaState on the ImageView's drawable by casting it
((MediaControlDrawable) mImageView.getDrawable()).setMediaState(MediaControlDrawable.State.PAUSE);

The following options can be configured by calling the appropiate methods on the Builder object:

• setColor(@ColorInt int color): The color of the drawable. Defaults to Color.WHITE.
• setPadding(float padding): The internal padding of the drawable. This is useful if you want the drawable to be smaller than the containing ImageView. Defaults to 0dp. Note: In addition to the padding, the drawable will add a trim area as specified in the System icons section of the guidelines.
• setInitialState(MediaControlDrawable.State state): The initial state or icon of the drawable. Defaults to MediaControlDrawable.State.PLAY.
• setAnimationInterpolator(Interpolator interpolator): The interpolator to use for the animated transition between icons. Defaults to an AccelerateDecelerateInterpolator.
• setAnimationDuration(int duration): The duration of the animated transition between icons. Defaults to 500ms.

2. IndeterminateProgressDrawable

The IndeterminateProgressDrawable tries to mimick the animation presented in the stock Android Lollipop as closely as possible. It, too, is easy to build and can be configured any way you like it. Here's an example of how you would go about creating a new IndeterminateProgressDrawable:

final IndeterminateProgressDrawable drawable = new IndeterminateProgressDrawable.Builder(this)
        .setColor(Color.WHITE)
        .setPadding(16 * dp)
        .setStrokeWidth(4 * dp)
        .build();
// Use this drawable in an ImageView
mImageView.setImageDrawable(drawable);
drawable.start();
// Or use this drawable with a ProgressBar (no start() call needed)
mProgressBar.setIndeterminateDrawable(drawable);

The following options can be configured by calling the appropiate methods on the Builder object:

• setColor(@ColorInt int color): The color of the drawable. Defaults to R.attr.colorAccent.
• setPadding(float padding): The internal padding of the drawable. Defaults to the padding of the stock Android Lollipop progress drawable, which is 3/48 * size.
• setStrokeWidth(float width): The stroke width of the progress arc. Defaults to the stroke width of the stock Android Lollipop progress drawable, which is 4/48 * size.