If you like pina coladas 🍹, and getting caught in the rain 🌧, AND you can’t
remember the difference between each of the various
then this blog post is for YOU 👈🏼!
Animations – motion, interactions and transitions – are all a critical
component of material design. They help to make the user experience feel more
natural and fluid. But designing and implementing the perfect animation can be a
cumbersome and timely process. Luckily, the Android SDK does a lot to help us
along - with things like
Transitions, but often
times simply remembering all that is available can feel like half the battle.
Well folks, today I am here to help - introducing interpolator - an open
sourced app - with all the
Interpolator subclasses visualized on one screen.
Each interpolator is applied to an identical pink dot in a vertical list. All
of the dots have the exact same animation set on them except, of course, for
their interpolator. As you can see in the screenshot above, the dots are all
labeled with their respective
Interpolator class name so you can easily see
which one is which without having to look at the code. As an added bonus, each
of the dots is draggable, so you can easily compare and contrast the effects of
two different interpolators side by side.
Check out the code to download the app today!
But in case you’re in a hurry or you just want to see some pretty animations,
right this second, here are all of the various
Interpolators in action:
- Accelerate Decelerate, Accelerate, Anticipate & Anticipate Overshoot:
- Bounce, Decelerate, Fast Out Linear In & Fast Out Slow In:
- Fast Out Slow In, Linear, Linear Out Slow In & Overshoot
And if you liked these Android visual aids,
you might also enjoy our
ImageView.scaleType visual guide.