欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Android 动画之逐帧动画(Frame Animation)

程序员文章站 2022-03-16 15:13:17
...

概述

Android 3.0 之前,有两种类型:逐帧动画和补间动画;
Android 3.0 发布时,Android SDK 又提供了更加简单的属性动画;
Android 4.4 发布时,Android SDK 又提供了 android.transition 框架,更直观实现动画。

逐帧动画

也叫 Drawable Animation。有两种方式可以定义 XML 资源文件和代码实现。

XML 资源文件方式

  • 根标签为animation-list
  • 属性 oneshot true - 展示一遍,false - 循环播放动画
  • item标签对动画中的每一个图片进行声明
  • android:duration 图片展示时长
<?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/wifi_01"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/wifi_02"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/wifi_03"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/wifi_04"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/wifi_05"  
        android:duration="200"/>  
    <item  
        android:drawable="@drawable/wifi_06"  
        android:duration="200"/> 
</animation-list>  

案例

<?xml version="1.0" encoding="utf-8"?>  
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="match_parent"  
    android:layout_height="match_parent"  
    android:gravity="center"  
    android:orientation="vertical">  
  
    <Button  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:onClick="setStart"  
        android:text="开始" />  
  
    <Button  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:layout_marginBottom="20dp"  
        android:onClick="setEnd"  
        android:text="结束" />  
  
    <ImageView  
        android:id="@+id/iv_anim"  
        android:layout_width="100dp"  
        android:layout_height="100dp"  
        android:padding="5dp"  
        android:src="@drawable/anim_fram" />  
</LinearLayout>  
private ImageView imageView;  
private AnimationDrawable animDrawable;  
  
@Override  
protected void onCreate(@Nullable Bundle savedInstanceState) {  
    super.onCreate(savedInstanceState);  
    setContentView(R.layout.activity_yao);  
    imageView = (ImageView) findViewById(R.id.iv_anim);  
    animDrawable = (AnimationDrawable) imageView.getDrawable();  
}  
  
public void setStart(View view) {  
    animDrawable.start();  
}  
  
public void setEnd(View view) {  
    animDrawable.stop();  
}  

代码

    private ImageView imageView;  
    private AnimationDrawable mAnimDrawable;  
  
    @Override  
    protected void onCreate(@Nullable Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity_yao);  
        imageView = (ImageView) findViewById(R.id.iv_anim);  
        initDrawable();  
    }  
  
    private void initDrawable() {  
        mAnimDrawable = new AnimationDrawable();  
        for (int i = 1; i <= 6; i++) {  
            int id = getResources().getIdentifier("wifi_0" + i, "drawable", getPackageName());  
            Drawable drawable = getResources().getDrawable(id);  
            // 添加一帧,并设置该帧显示的持续时间  
            mAnimDrawable.addFrame(drawable, 200);  
        }  
        mAnimDrawable.setOneShot(false);  
        imageView.setImageDrawable(mAnimDrawable);  
    }  
  
    public void setStart(View view) {  
        AnimationDrawable animDrawable = (AnimationDrawable) imageView.getDrawable();  
        animDrawable.start();  
    }  
  
    public void setEnd(View view) {  
        AnimationDrawable animDrawable = (AnimationDrawable) imageView.getDrawable();  
        animDrawable.stop();  
    }