Custom Animation

If the existed animations can not meet the demand, then you can custom your own animations. For all animations, they must extends from PageAnimation or its abstract sub-classes.

As the picture shows, you can try to extends:

• PageAnimation
• SingleColorPageAnimation, which aims to change a single color.
• MultiColorPageAnimation, which is used to change multi-color.
• TextPageAnimation, performs a text-transformation animation.
• XYPageAnimation, changes x and y values of position, translation, scale or anything else.
• XYZPageAnimation, provides an animation to change x, y and z values of 3D position, rotation or anything else.

Custom PageAnimation

For instance, if we wanna create an animation to change someValue of a view:

public class CustomSomeValueAnimation extends PageAnimation {
    
    private float fromSomeValue;
    private float toSomeValue;

    public CustomSomeValueAnimation(int page,
                                    float startOffset,
                                    float endOffset,
                                    int ease,
                                    TimeInterpolator interpolator,
                                    boolean useSameEaseEnumBack,
                                    float fromSomeValue,
                                    float toSomeValue) {
        super(page, startOffset, endOffset, ease, interpolator, useSameEaseEnumBack);
        this.fromSomeValue = fromSomeValue;
        this.toSomeValue = toSomeValue;
    }

    @Override
    protected void toStartState(View view) {
         view.setSomeValue(fromSomeValue);
    }

    @Override
    protected void toMiddleState(View view, float offset) {
         view.setSomeValue(fromSomeValue + (toSomeValue - fromSomeValue) * offset);
    }

    @Override
    protected void toEndState(View view) {
        view.setSomeValue(toSomeValue);
    }

    public static Builder builder() {
        return new Builder();
    }

    public static class Builder extends PageAnimation.Builder<CustomSomeValueAnimation.Builder> {

        private float fromSomeValue = UNINITIALIZED_VALUE;
        private float toSomeValue = UNINITIALIZED_VALUE;

        public Builder from(float fromSomeValue) { this.fromSomeValue = fromSomeValue; return this; }

        public Builder to(float toSomeValue) { this.toSomeValue = toSomeValue; return this; }

        public CustomSomeValueAnimation build() {
            checkUninitializedAttributes();
            return new CustomSomeValueAnimation(page, startOffset, endOffset, ease, interpolator, useSameEaseEnumBack, fromSomeValue, toSomeValue);
        }

        @Override
        protected void checkUninitializedAttributes() {
            // Check the uninitialized attributes here if needed.
            if (fromSomeValue == UNINITIALIZED_VALUE) uninitializedAttributeException("fromSomeValue");
            if (toSomeValue == UNINITIALIZED_VALUE) uninitializedAttributeException("toSomeValue");
        }
    }
}

The key point is to override the 3 methods toStartState, toMiddleState and toEndState. In these methods, you have do change an attribute of a view.

Custom SingleColorPageAnimation

public class CustomSomeSingleColorAnimation extends SingleColorPageAnimation {

    public CustomSomeSingleColorAnimation(int page,
                                          float startOffset,
                                          float endOffset,
                                          int ease,
                                          TimeInterpolator interpolator,
                                          boolean useSameEaseEnumBack,
                                          Integer fromColor,
                                          Integer toColor,
                                          Chameleon chameleon) {
        super(page, startOffset, endOffset, ease, interpolator, useSameEaseEnumBack, fromColor, toColor, chameleon);
    }

    @Override
    protected void toStartState(View view) {
         view.setSomeSingleColor(fromColor);
    }

    @Override
    protected void toMiddleState(View view, float offset) {
         view.setSomeSingleColor(middleColor(chameleon, offset));
    }

    @Override
    protected void toEndState(View view) {
        view.setSomeSingleColor(toColor);
    }

    public static Builder builder() {
        return new Builder();
    }

    public static class Builder extends SingleColorPageAnimation.Builder<CustomSomeSingleColorAnimation.Builder> {

        public CustomSomeSingleColorAnimation build() {
            checkUninitializedAttributes();
            return new CustomSomeSingleColorAnimation(page, startOffset, endOffset, ease, interpolator, useSameEaseEnumBack, fromColor, toColor, chameleon);
        }
    }
}

Similar to customizing PageAnimation, in toStartState, toMiddleState and toEndState methods, you have to change the color of some attributes of a view. The parameters fromColor, toColor, chameleon and method middleColor are already defined in SingleColorPageAnimation.

For a demo of customize-animation, check CustomAnimation and CustomAnimationActivity for more details.