Android Animation Interpolators

When you animate a view property in Android, you set the start and end values for the property, and the framework takes care of animating smoothly from the start value to the end value in the time that you have specified.

The naive way to do this is the LinearInterpolator, which steps the property in equal amounts over each frame of the animation. However, you have other options which may fit your use better.

For example, if sliding a view onto the screen, you might use the DecelerateInterpolator, since it will start out moving the view quickly, then slow down and ease into its final location.

The Android documentation describes the available interpolators in prose, but as a visual thinker I prefered to see them graphed out, so the following charts show the available interpolators and allow you to change their parameters interactively.

Descriptions and formulae were copied from the Android 4.4 source code.
More info on what Interpolators are and how to use them available in the docs.
Charts are made with Chart.js by Nick Downie.

Please direct feedback to @jebstuart, +JebWare or jeb@jebware.com.

AccelerateDecelerateInterpolator

An interpolator where the rate of change starts and ends slowly but accelerates through the middle.




AccelerateInterpolator

An interpolator where the rate of change starts out slowly and and then accelerates.

factor - Degree to which the animation should be eased. Seting factor to 1.0f produces a y=x^2 parabola. Increasing factor above 1.0f exaggerates the ease-in effect (i.e., it starts even slower and ends evens faster)

factor:



AnticipateInterpolator

An interpolator where the change starts backward then flings forward.

tension - Amount of anticipation. When tension equals 0.0f, there is no anticipation and the interpolator becomes a simple acceleration interpolator.

tension:



AnticipateOvershootInterpolator

An interpolator where the change starts backward then flings forward and overshoots the target value and finally goes back to the final value.

tension - Amount of anticipation/overshoot. When tension equals 0.0f, there is no anticipation/overshoot and the interpolator becomes a simple acceleration/deceleration interpolator.
extraTension - Amount by which to multiply the tension. For instance, to get the same overshoot as an OvershootInterpolator with a tension of 2.0f, you would use an extraTension of 1.5f.

tension: extra tension:



BounceInterpolator

An interpolator where the change bounces at the end.




CycleInterpolator

Repeats the animation for a specified number of cycles. The rate of change follows a sinusoidal pattern.

cycles -

cycles:



DecelerateInterpolator

An interpolator where the rate of change starts out quickly and and then decelerates.

factor - Degree to which the animation should be eased. Setting factor to 1.0f produces an upside-down y=x^2 parabola. Increasing factor above 1.0f makes exaggerates the ease-out effect (i.e., it starts even faster and ends evens slower)

factor:



LinearInterpolator

An interpolator where the rate of change is constant




OvershootInterpolator

An interpolator where the change flings forward and overshoots the last value then comes back.

tension - Amount of overshoot. When tension equals 0.0f, there is no overshoot and the interpolator becomes a simple deceleration interpolator.

tension: