仿抖音加载动画(两个小球转动)效果_抖音两个球特效-CSDN博客

本文链接：https://blog.csdn.net/csclmf/article/details/89959179

本文介绍了如何在Android中创建一个仿抖音加载动画，详细步骤包括创建attr.xml以定义属性，自定义双球转动的View，以及在Dialog中引用加载动画。通过这些步骤，轻松实现类似抖音的加载数据动画效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

经常玩抖音的小伙伴肯定熟悉抖音的加载效果，但是如何实现的呢？先上效果图：

是不是感觉很不错呢？接下来直接上代码：

1、先创建一个attr.xml文件夹用来自定义属性:

<?xml version="1.0" encoding="utf-8"?>
<resources>
       <!--仿抖音Loading-->
    <declare-styleable name="LoadingView">
        <attr name="radius1" format="dimension"/> <!--球1的半径,默认为6dp,设置的方法:setRadius()-->
        <attr name="radius2" format="dimension"/><!--球2的半径,默认为6dp,设置的方法:setRadius()-->
        <attr name="rtlScale" format="float"/><!--小球从右往左的最大缩放倍数,默认0.7,设置的方法:setScales()-->
        <attr name="ltrScale" format="float"/><!--小球从左往右的最大缩放倍数,默认1.3,设置的方法:setScales()-->
        <attr name="color1" format="color"/><!--球1的颜色,默认设置的方法:setColors()-->
        <attr name="color2" format="color"/><!--球2的颜色,默认设置的方法:setColors()-->
        <attr name="mixColor" format="color"/><!--叠加的颜色,默认是黑色,设置的方法:setColors()-->
        <attr name="duration" format="integer"/><!--一次转动的动画时长，默认:350ms,设置的方法:setDuration()-->
        <attr name="pauseDuration" format="integer"/><!--一次转动动画以后停顿的时间,默认80ms,设置的方法:setDuration()-->
        <attr name="gap" format="dimension"/><!--两球的间隔,默认0.8dp,设置方法：setRadius()-->
        <attr name="scaleStartFraction" format="float"/><!--动画进度在[0,scaleStartFraction]期间，小球大小逐渐缩放，默认0.2f,设置的方法:setStartEndFraction()-->
        <attr name="scaleEndFraction" format="float"/><!--动画进度在[scaleEndFraction,1]期间，小球大小逐渐恢复，默认0.8f,设置的方法:setStartEndFraction()-->
    </declare-styleable>
</resources>

2、自定义双球转动的View

/**
 * @author csc
 * @date 2019-5-7
 * Todo 仿抖音加载View
 */
public class LoadingView extends View {

    //默认值
    private final float RADIUS = dp2px(6);
    private final float GAP = dp2px(0.8f);
    private static final float RTL_SCALE = 0.7f;
    private static final float LTR_SCALR = 1.3f;
    private static final int LEFT_COLOR = 0XFFFF4040;
    private static final int RIGHT_COLOR = 0XFF00EEEE;
    private static final int MIX_COLOR = Color.BLACK;
    private static final int DURATION = 350;
    private static final int PAUSE_DUARTION = 80;
    private static final float SCALE_START_FRACTION = 0.2f;
    private static final float SCALE_END_FRACTION = 0.8f;


    //属性
    private float radius1; //初始时左小球半径
    private float radius2; //初始时右小球半径
    private float gap; //两小球直接的间隔
    private float rtlScale; //小球从右边移动到左边时大小倍数变化(rtl = right to left)
    private float ltrScale;//小球从左边移动到右边时大小倍数变化
    private int color1;//初始左小球颜色
    private int color2;//初始右小球颜色
    private int mixColor;//两小球重叠处的颜色
    private int duration; //小球一次移动时长
    private int pauseDuration;//小球一次移动后停顿时长
    private float scaleStartFraction; //小球一次移动期间，进度在[0,scaleStartFraction]期间根据rtlScale、ltrScale逐渐缩放，取值为[0,0.5]
    private float scaleEndFraction;//小球一次移动期间，进度在[sc