帧动画的简介:
帧动画非常容易理解,其实就是简单的由N张静态图片收集起来,然后我们通过控制依次显示这些图片,因为人眼"视觉残留"的原因,会让我们造成动画的"错觉",跟放电影的原理一样。
而Android中实现帧动画,一般我们会用到AnimationDrawable 先编写好Drawable,然后代码中调用start()以及stop()开始或停止播放动画。
实现效果如图:
方式一:
实现步骤:
一、布局activity_heart.xml
<?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:orientation="vertical" > <ImageView android:id="@+id/iv_frame_anim" android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="fitXY" android:layout_weight="1" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/btn_frame_anim" android:text="开始播放帧动画" android:layout_marginBottom="50dp" /> </LinearLayout>
二、HeartActivity代码:
public class HeartActivity extends AppCompatActivity implements View.OnClickListener { private ImageView iv_frame_anim; private AnimationDrawable animationDrawable; //声明一个帧动画对象 private Button btn_frame_anim; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_heart); iv_frame_anim = findViewById(R.id.iv_frame_anim); btn_frame_anim = findViewById(R.id.btn_frame_anim); btn_frame_anim.setOnClickListener(this); btn_frame_anim.setText("暂停播放帧动画"); showFrameAnimByCode(); } //在代码中生成帧动画进行播放 private void showFrameAnimByCode() { //创建帧动画 animationDrawable = new AnimationDrawable(); //下面把每帧图片加入到帧动画的队列中 animationDrawable.addFrame(getResources().getDrawable(R.drawable.flow_p1),50); animationDrawable.addFrame(getResources().getDrawable(R.drawable.flow_p2),50); animationDrawable.addFrame(getResources().getDrawable(R.drawable.flow_p3),50); animationDrawable.addFrame(getResources().getDrawable(R.drawable.flow_p4),50); animationDrawable.addFrame(getResources().getDrawable(R.drawable.flow_p5),50); animationDrawable.addFrame(getResources().getDrawable(R.drawable.flow_p6),50); animationDrawable.addFrame(getResources().getDrawable(R.drawable.flow_p7),50); animationDrawable.addFrame(getResources().getDrawable(R.drawable.flow_p8),50); //设置帧动画是否播放一次 true:表示只播放一次 false:表示循环播放 animationDrawable.setOneShot(false); //设置图像视图的图形为帧动画 iv_frame_anim.setImageDrawable(animationDrawable); //开始播放帧动画 animationDrawable.start(); } @Override public void onClick(View v) { if (v.getId()==R.id.btn_frame_anim){ if (animationDrawable.isRunning()){ animationDrawable.stop(); btn_frame_anim.setText("开始播放帧动画"); }else { animationDrawable.start(); btn_frame_anim.setText("暂停播放帧动画"); } } } }
方式二:用xml的方式也可以实现相同的效果
1、在res的drawable目录下,创建running_animation_drawable.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/nv1" android:duration="500" /> <item android:drawable="@drawable/nv2" android:duration="500" /> <item android:drawable="@drawable/nv3" android:duration="500" /> <item android:drawable="@drawable/nv4" android:duration="500" /> </animation-list>
2、在布局文件中进行引用
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout 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="match_parent" tools:context=".activity.AnimationDrawableActivity"> <ImageView android:id="@+id/iv_drawable" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:background="@drawable/running_animation_drawable" /> <Button android:id="@+id/btn_animation_drawable_start" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:text="启动动画" /> <Button android:id="@+id/btn_animation_drawable_stop" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_toRightOf="@id/btn_animation_drawable_start" android:text="停止动画" /> </RelativeLayout>
3、在AnimationDrawableActivity 中启动动画,停止动画
public class AnimationDrawableActivity extends AppCompatActivity { private Button btn_animation_drawable_start; private Button btn_animation_drawable_stop; private ImageView iv_drawable; private AnimationDrawable animationDrawable; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_animation_drawable); btn_animation_drawable_start = findViewById(R.id.btn_animation_drawable_start); btn_animation_drawable_stop = findViewById(R.id.btn_animation_drawable_stop); iv_drawable = findViewById(R.id.iv_drawable); btn_animation_drawable_start.setOnClickListener(onClickListener); } private final View.OnClickListener onClickListener = new View.OnClickListener() { @Override public void onClick(View v) { switch (v.getId()) { case R.id.btn_animation_drawable_start: //动画图片对象 animationDrawable = (AnimationDrawable) iv_drawable.getBackground(); //启动 animationDrawable.start(); break; case R.id.btn_animation_drawable_stop: if (animationDrawable != null) { animationDrawable.stop(); animationDrawable = null; } break; default: break; } } }; }