简介:Animations driven by finger movement
更多:作者   提 Bug   

OffsetAnimator lets animate objects basing on touchevents, so users can be engaged in an animation process.

Yellow submarine


Add the library to your project:

1) Add it in your root build.gradle at the end of repositories:

allprojects {
    repositories {
        maven { url '' }

2) Add the dependency:

dependencies {
    compile 'com.github.russelarms:offsetanimator:1.0.2'


Min sdk version is 11. The library doesn't have any transitive dependencies.


A Comprehensive tutorial.


To create viewpager-based animation you should bind a scene to position updates:

ViewPagerAnimatorAdapter animatorAdapter = new ViewPagerAnimatorAdapter(scene.getScene());
viewPager.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {

    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        super.onPageScrolled(position, positionOffset, positionOffsetPixels);
        animatorAdapter.onPageScrolled(position, positionOffset);

Then create a scene instance and pass it a root view and an initializer function:

Scene.create(getRootView(), () -> initSteps());


Script desired animation like this:

private void initSteps() {
            .createAnimation(ocean.getY(), ocean.getY() - convertDIPToPixels(getContext(), 120))
            .setInterpolator(new DecelerateInterpolator())
            .setListener(value -> ocean.setY(value));

A single page is taken as 1.0f. So duration 0.5f is a half of a distance.

Lazy initialization

It is not always convenient to specify exact view positions after some script done, so we can pass a lazy initializer. In this example animator will be initialized only on page 3 with corresponding coordinates:
        .createAnimation(() -> AnimatorFactory.createAnimator(fishLeftBottom.getY(), fishLeftBottom.getY() + screenDimensions.y / 2))
        .setListener(value -> fishLeftBottom.setY(value));

Here's how to set the rotation:
        .createAnimation(0, 90)
        .setListener(value -> submarine.setRotation(value));


We can specify an interpolator (from android.view.animation). The library ships its own SpringInterpolator:
        .createAnimation(1926, 1032)
        .setInterpolator(new SpringInterpolator(0.8f))
        .setListener(value -> submarine.setY(value));

Arc animations

Create arc animation:
        .createAnimation(() -> AnimatorFactory.createArcAnimator(submarine,
                convertDIPToPixels(getContext(), 48),
                submarine.getX() + submarine.getWidth() / 2,
                180f, Side.RIGHT))

While standard OffsetAnimator requires user to set listeners and update fields by hand, arc animator doesn't need listener: it assigns value implicitly.


OffsetAnimator is open to be inherited:

public class AnotherOffsetAnimator extends OffsetAnimator {

    public AnotherOffsetAnimator(float x1, float x2) {
        super(x1, x2);

    public void animate(float position) {

and to be used with a scene:
        .createAnimation(() -> new AnotherOffsetAnimator(fishRight.getX(), fishRight.getX() + convertDIPToPixels(getContext(), 160)))
        .setListener(value -> fishRight.setX(value));


OffsetAnimator is available under the MIT license. See the LICENSE file for more info. The library uses some code from for arc animations.

The submarine and the fish images picked from Designed by Freepik Background vector created by Freepik

Copyright 2017 russelarms.

Android 开发经验分享
C 轮融资近 30 亿元理财推荐
Android 开发经验分享
C 轮融资近 30 亿元理财推荐