Thanks to Raphael Loder for the image!

Bringing smooth animation transitions to Android

Why I wrote the AdditiveAnimation Android library and how it drastically improved the feel of our apps without any significant code changes — simultaneously making all animation-related code shorter, more performant and easier to read.


What changing the animation target usually looks like in Android — ugh!
Changing animation target with the AdditiveAnimator library.

Additive Animations

The API

AdditiveAnimator.animate(view).setDuration(1000)
                .x(touch.getX())
                .y(touch.getY())
                .start();

A more complex example

It looks much better in 60fps (download video here).
AdditiveAnimator anim = new AdditiveAnimator().withLayer();
for(View v : views) {
    anim = anim.target(v).x(x).y(y).rotation(r).thenWithDelay(50);
}
anim.start();

Update for 1.6.x:

AdditiveAnimator.animate(views, 50L).x(x).y(y).rotation(r).start();

Animation Chaining

Animator translationAnimator = ObjectAnimator
        .ofFloat(view, View.TRANSLATION_Y, 0f, -100f)
        .setDuration(700);

final Animator alphaAnimator = ObjectAnimator
        .ofFloat(view, View.ALPHA, 1f, 0f)
        .setDuration(300);

final AnimatorSet animatorSet = new AnimatorSet();
animatorSet.playSequentially(
        translationAnimator,
        alphaAnimator
);
animatorSet.start();
AdditiveAnimator.animate(view).setDuration(700)
                .translationY(-100)
                .then()
                .setDuration(300)
                .alpha(0f)
                .start();
From left to right: thenAfterDelay(400), thenBeforeEnd(400) and thenAfterEnd(400)

Stuff that didn’t make it into the post

new MyAnimator(view).x(100).then().bounceTwice().start();
TextView animatedView = ...;FloatProperty textColorProperty = new FloatProperty("textColor") {
    public Float get(View object) { 
        return Float.valueOf(textView.getCurrentTextColor()); 
    }
    public void set(View object, Float value) {
        textView.setTextColor(value.intValue()); 
    }
}AdditiveAnimator.animate(textView)
                .property(Color.RED, // target value
                          new ColorEvaluator(), // TypeEvaluator
                          textColorProperty)
                .start();
AdditiveAnimator.animate(view)
                .setInterpolator(new BounceInterpolator())
                .x(100).y(200)
                .switchInterpolator(new LinearInterpolator())
                .alpha(0)
                .start();

Getting the library

dependencies {
    compile ‘at.wirecube:additive_animations:1.7.2’
}
...
repositories {
    jcenter()
}

wirecube software engineering

Tales about the lives of developers and sysadmins at wirecube, a team of technology enthusiasts based in Graz, Austria.

David Ganster

Written by

Mobile Developer at wirecube

wirecube software engineering

Tales about the lives of developers and sysadmins at wirecube, a team of technology enthusiasts based in Graz, Austria.