Skip to content

Chaining Animations

Ivan Škorić edited this page Oct 31, 2017 · 5 revisions

The main power of RxJava in this combination is displayed when we use operators to chain animations and control the animations logic and flow. Since AnimationCompletable is a Completable, you can use all of the operators of RxJava2 Completable type.

This gives us the ability to compose animations in basically any way we can think of:

// Executes all animations one after another.
fadeIn(view1)
    .andThen(rotate(view2, 90f))
    .andThen(scale(view3, 0.5f))
    .subscribe();

// Executes all animations together.
fadeIn(view1)
    .mergeWith(rotate(view2, 90f))
    .mergeWith(scale(view3, 0.5f))
    .subscribe();

// Executes first two animations together, 
// and then the last animation after that.
(fadeIn(view1).mergeWith(rotate(view2, 90f)))
    .andThen(scale(view3, 0.5f))
    .subscribe();

AnimationSchedulers

AnimationSchedulers class provides methods for scheduling animations by giving you a simple syntax. Previous code sample becomes:

import static com.pspdfkit.vangogh.AnimationSchedulers.*;

// Executes all animations one after another.
sequentially(fadeIn(view1), rotate(view2, 90f), scale(view3, 0.5f)).subscribe();

// Executes all animations together.
together(fadeIn(view1), rotate(view2, 90f), scale(view3, 0.5f)).subscribe();

// Executes first two animations together, 
// and then the last animation after that.
sequentially(
      together(fadeIn(view1), rotate(view2, 90f)),
      scale(view3, 0.5f))
    .subscribe();

AnimationSchedulers are just used for syntactic sugar. You can always use default RxJava2 operators such as Completable#mergeArray() and Completable#concatArray() instead.

Repeating animations

In order to repeat the animation, you can use Completable#repeat() operator:

sequentially(fadeOut(view1), fadeIn(view1))
    .repeat(3)
    .subscribe();

Clone this wiki locally