Android自定义控件入门到精通--帧动画

《Android自定义控件入门到精通》文章索引 ☞ https://blog.youkuaiyun.com/Jhone_csdn/article/details/118146683

《Android自定义控件入门到精通》所有源码 ☞ https://gitee.com/zengjiangwen/Code

动画分为三种

• 帧动画（FrameAnimation/DrawableAnimation）
• 补间动画（TweenAnimation/ViewAnimation）
• 属性动画（PropertyAnimation）

帧动画

类似我们常见的gif动画(由一帧一帧的图片循环播放达到动画效果)

帧动画优点是使用简单又能实现比较复杂的动画效果

使用方法一：xml

步骤一：准备图片素材

步骤二：在drawable目录下写动画xml文件（anima_discove.xml）

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false" >

    <item
        android:drawable="@drawable/radar01"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar02"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar03"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar04"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar05"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar06"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar07"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar08"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar09"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar10"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar11"
        android:duration="250">
    </item>
    <item
        android:drawable="@drawable/radar12"
        android:duration="250">
    </item>

</animation-list>

步骤三：引用动画文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:background="#333333"
    tools:context=".activity.MainActivity">
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="160dp"
        android:layout_height="160dp"
        android:layout_gravity="center_horizontal"
        android:src="@drawable/anima_discove"
        />
    <Button
        android:id="@+id/playBtn"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:layout_margin="20dp"
        android:textSize="14sp"
        android:text="播放"
        android:textColor="#222222"
        android:background="#e7e7e7"
        android:gravity="center"
        />
    <Button
        android:id="@+id/stopBtn"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:layout_margin="20dp"
        android:textSize="14sp"
        android:textColor="#222222"
        android:text="停止"
        android:background="#e7e7e7"
        android:gravity="center"
        />
</LinearLayout>

步骤四：代码实现控制播放和停止

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ImageView imageView=findViewById(R.id.imageView);
        Button playBtn=findViewById(R.id.playBtn);
        Button stopBtn=findViewById(R.id.stopBtn);

        final AnimationDrawable animationDrawable= (AnimationDrawable) imageView.getDrawable();
        animationDrawable.setOneShot(false);//设置是否只执行一遍（循环）
        playBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                animationDrawable.start();
            }
        });
        stopBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                animationDrawable.stop();
            }
        });
    }
}

除了ImageView的src引用，还可以设置给任意View的background，background动画的获取方式为：

 AnimationDrawable animationDrawable= (AnimationDrawable) imageView.getBackground();

使用方法二：java

final AnimationDrawable animationDrawable= new AnimationDrawable();
animationDrawable.addFrame(getDrawable(R.drawable.radar01),250);
animationDrawable.addFrame(getDrawable(R.drawable.radar02),250);
animationDrawable.addFrame(getDrawable(R.drawable.radar03),250);
animationDrawable.addFrame(getDrawable(R.drawable.radar04),250);
animationDrawable.addFrame(getDrawable(R.drawable.radar05),250);
animationDrawable.addFrame(getDrawable(R.drawable.radar06),250);
animationDrawable.addFrame(getDrawable(R.drawable.radar07),250);
animationDrawable.addFrame(getDrawable(R.drawable.radar08),250);
animationDrawable.setOneShot(false);//设置是否只执行一遍（循环）
//如果不是ImageView，也可以使用setBackGround()引用动画
imageView.setImageDrawable(animationDrawable);

直接使用java代码的方式创建AnimationDrawable对象