SoFunction
Updated on 2025-04-12

Detailed explanation of Android custom view animation effect

Frame animation

Frame animation is an animation that gives all the keyframes of a complete animation and imagines the process of change in the middle by the brain.

<?xml version="1.0" encoding="utf-8"?> 
<animation-list xmlns:andro android:oneshot="false">
    <item android:drawable="@drawable/ic_loading_0" android:duration="100"/>
    <item android:drawable="@drawable/ic_loading_1" android:duration="100"/>
    <item android:drawable="@drawable/ic_loading_2" android:duration="100"/> 
    <item android:drawable="@drawable/ic_loading_3" android:duration="100"/> 
    <item android:drawable="@drawable/ic_loading_4" android:duration="100"/> 
    <item android:drawable="@drawable/ic_loading_5" android:duration="100"/> 
    <item android:drawable="@drawable/ic_loading_6" android:duration="100"/>
    <item android:drawable="@drawable/ic_loading_7" android:duration="100"/>
</animation-list>

Put this xml file in the drawable folder and you can reference it.

Tween animation

Tween animation is to specify the state of the beginning and end of the animation, and the changes in the middle will be automatically filled by the computer. There are 4 types of tween animations: Translate, Translate, Alpha, Rotate, and Scale.

Rotate animation

<?xml version="1.0" encoding="utf-8"?> 
<rotate xmlns:andro android:duration="1000"
        android:fillAfter="true"
        android:fromDegrees="0"
        android:pivotX="50%" 
        android:pivotY="50%"
        android:repeatCount="1"
        android:toDegrees="180">
</rotate>

Transparency animation

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:andro android:duration="1000"
       android:fromAlpha="1.0"
       android:toAlpha="0.5">
</alpha>

Flat moving painting

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:andro android:duration="1000"
           android:fromXDelta="0"
           android:fromYDelta="0"
           android:toXDelta="100%"
           android:toYDelta="100%">
</translate>

Zoom animation

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:andro android:duration="1000"
       android:fromXScale="1.0"
       android:fromYScale="1.0"
       android:toXScale="1.2"
       android:toYScale="1.2"
       android:pivotX="50%"
       android:pivotY="50%">
</scale>

Attribute animation

Attribute animation is an animation that monitors the changing value of an attribute to complete. In short, it is to constantly modify a certain property value of the object and then let the animation framework listen to it.

ValueAnimator

(0f, 1f)

Create an animation that changes gradually from 0 to 1 point.

ObjectAnimator

new ObjectAnimator().addListener(new AnimatorListenerAdapter() {
    @Override
    public void onAnimationCancel(Animator animation) {
        (animation);
    }

    @Override
    public void onAnimationEnd(Animator animation) {
        (animation);
    }

    @Override
    public void onAnimationRepeat(Animator animation) {
        (animation);
    }

    @Override
    public void onAnimationStart(Animator animation) {
        (animation);
    }

    @Override
    public void onAnimationPause(Animator animation) {
        (animation);
    }

    @Override
    public void onAnimationResume(Animator animation) {
        (animation);
    }
});

Monitor the status of the animation.

TypeEvaluator Valuator

public interface TypeEvaluator<T> {

    /**
     * This function returns the result of linearly interpolating the start and end values, with
     * <code>fraction</code> representing the proportion between the start and end values. The
     * calculation is a simple parametric calculation: <code>result = x0 + t * (x1 - x0)</code>,
     * where <code>x0</code> is <code>startValue</code>, <code>x1</code> is <code>endValue</code>,
     * and <code>t</code> is <code>fraction</code>.
     *
     * @param fraction   The fraction from the starting to the ending values
     * @param startValue The start value.
     * @param endValue   The end value.
     * @return A linear interpolation between the start and end values, given the
     *         <code>fraction</code> parameter.
     */
    public T evaluate(float fraction, T startValue, T endValue);

}

Use an estimator to calculate all intermediate values ​​for two edge states.

(target, propertyName, evaluator, values);

The target parameter is the object to be monitored, propertyName is the name of a property of the object to be monitored, and the setXxx() method of the property can also be monitored. The evaluator passes in an estimator, and values ​​are the values ​​of all the key points you want to estimate, and then through these given points, we estimate the value of this point in the middle moments within a certain period of time.

Interpolator interpolation

public interface Interpolator extends TimeInterpolator {
    // A new interface, TimeInterpolator, was introduced for the new 
    // package. This older Interpolator interface extends TimeInterpolator so that users of
    // the new Animator-based animations can use either the old Interpolator implementations or
    // new classes that implement TimeInterpolator directly.
}

Use its implementation class to determine the change rate of the animation, such as fast first and then slow, slow first and then fast, constant speed, etc. The more commonly used ones are LinearInterpolator (constant speed), AccelerateInterpolator (accelerate), and DecelerateInterpolator (decelerate). ValueAnimator and ObjectAnimator can be called

public abstract void setInterpolator(TimeInterpolator value);

Set the interpolation because this method is from the Animator abstract class.

This is the end of this article about the detailed explanation of Android custom view animation effects. For more related Android custom view content, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!