Android动画之逐帧动画(FrameAnimation)详解

 

Android动画之逐帧动画(FrameAnimation)详解

标签: Android动画逐帧动画FrameAnimation
  210人阅读  评论(0)  收藏  举报
  分类:

转载请注明出处:http://blog.csdn.net/xiaohao0724/article/details/54582965


Android中的动画,大概分为三种:

1、逐帧动画(FrameAnimation)

2、补间动画(TweenAnimation)

3、属性动画(PropertyAnimation)


今天我们就来学习逐帧动画,废话少说直接上效果图如下:




帧动画的实现方式有两种:

一、在res/drawable文件夹下新建animation-list的XML实现帧动画

1、首先在res/drawable文件夹下添加img00-img24共25张图片

2、新建frame_anim.xml

[html]  view plain  copy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <animation-list xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:oneshot="true" >  
  4.   
  5.     <!-- animation-list 帧动画 -->  
  6.     <!-- android:oneshot的值为 false代表播放多次,true代表只播放一次 -->  
  7.     <!-- duration代表每张图片的播放时间 ,定义一个持续时间为50毫秒的动画帧 -->  
  8.     <item  
  9.         android:drawable="@drawable/img00"  
  10.         android:duration="50"/>  
  11.     <item  
  12.         android:drawable="@drawable/img01"  
  13.         android:duration="50"/>  
  14.     <item  
  15.         android:drawable="@drawable/img02"  
  16.         android:duration="50"/>  
  17.     <item  
  18.         android:drawable="@drawable/img03"  
  19.         android:duration="50"/>  
  20.     <item  
  21.         android:drawable="@drawable/img04"  
  22.         android:duration="50"/>  
  23.     <item  
  24.         android:drawable="@drawable/img05"  
  25.         android:duration="50"/>  
  26.     <item  
  27.         android:drawable="@drawable/img06"  
  28.         android:duration="50"/>  
  29.     <item  
  30.         android:drawable="@drawable/img07"  
  31.         android:duration="50"/>  
  32.     <item  
  33.         android:drawable="@drawable/img08"  
  34.         android:duration="50"/>  
  35.     <item  
  36.         android:drawable="@drawable/img09"  
  37.         android:duration="50"/>  
  38.     <item  
  39.         android:drawable="@drawable/img10"  
  40.         android:duration="50"/>  
  41.     <item  
  42.         android:drawable="@drawable/img11"  
  43.         android:duration="50"/>  
  44.     <item  
  45.         android:drawable="@drawable/img12"  
  46.         android:duration="50"/>  
  47.     <item  
  48.         android:drawable="@drawable/img13"  
  49.         android:duration="50"/>  
  50.     <item  
  51.         android:drawable="@drawable/img14"  
  52.         android:duration="50"/>  
  53.     <item  
  54.         android:drawable="@drawable/img15"  
  55.         android:duration="50"/>  
  56.     <item  
  57.         android:drawable="@drawable/img16"  
  58.         android:duration="50"/>  
  59.     <item  
  60.         android:drawable="@drawable/img17"  
  61.         android:duration="50"/>  
  62.     <item  
  63.         android:drawable="@drawable/img18"  
  64.         android:duration="50"/>  
  65.     <item  
  66.         android:drawable="@drawable/img19"  
  67.         android:duration="50"/>  
  68.     <item  
  69.         android:drawable="@drawable/img20"  
  70.         android:duration="50"/>  
  71.     <item  
  72.         android:drawable="@drawable/img21"  
  73.         android:duration="50"/>  
  74.     <item  
  75.         android:drawable="@drawable/img22"  
  76.         android:duration="50"/>  
  77.     <item  
  78.         android:drawable="@drawable/img23"  
  79.         android:duration="50"/>  
  80.     <item  
  81.         android:drawable="@drawable/img24"  
  82.         android:duration="50"/>  
  83.   
  84. </animation-list>  

3、在activity_main中添加控件

[html]  view plain  copy
  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     tools:context="com.havorld.frameanimation.MainActivity" >  
  6.   
  7.     <ImageView  
  8.         android:id="@+id/imageView"  
  9.         android:layout_width="wrap_content"  
  10.         android:layout_height="wrap_content"  
  11.         android:layout_centerInParent="true" />  
  12.     <!-- android:background="@drawable/frame_anim" -->  
  13.   
  14.     <LinearLayout  
  15.         android:layout_width="match_parent"  
  16.         android:layout_height="wrap_content"  
  17.         android:layout_alignParentBottom="true"  
  18.         android:orientation="horizontal"  
  19.         android:padding="10dp" >  
  20.   
  21.         <Button  
  22.             android:id="@+id/start"  
  23.             android:layout_width="0dp"  
  24.             android:layout_height="wrap_content"  
  25.             android:layout_weight="1"  
  26.             android:text="播放" />  
  27.   
  28.         <Button  
  29.             android:id="@+id/stop"  
  30.             android:layout_width="0dp"  
  31.             android:layout_height="wrap_content"  
  32.             android:layout_weight="1"  
  33.             android:text="停止" />  
  34.     </LinearLayout>  
  35.   
  36. </RelativeLayout>  

4、在代码中获取并开启帧动画

[java]  view plain  copy
  1. public class MainActivity extends Activity implements OnClickListener {  
  2.   
  3.     private ImageView imageView;  
  4.     private AnimationDrawable animationDrawable;  
  5.   
  6.     @Override  
  7.     protected void onCreate(Bundle savedInstanceState) {  
  8.         super.onCreate(savedInstanceState);  
  9.         setContentView(R.layout.activity_main);  
  10.   
  11.         imageView = (ImageView) findViewById(R.id.imageView);  
  12.         findViewById(R.id.start).setOnClickListener(this);  
  13.         findViewById(R.id.stop).setOnClickListener(this);  
  14.   
  15.         setXml2FrameAnim1();  
  16.         // setXml2FrameAnim2();  
  17.   
  18.     }  
  19.   
  20.     /** 
  21.      * 通过XML添加帧动画方法一 
  22.      */  
  23.     private void setXml2FrameAnim1() {  
  24.   
  25.         // 把动画资源设置为imageView的背景,也可直接在XML里面设置  
  26.         imageView.setBackgroundResource(R.drawable.frame_anim);  
  27.         animationDrawable = (AnimationDrawable) imageView.getBackground();  
  28.     }  
  29.   
  30.     /** 
  31.      * 通过XML添加帧动画方法二 
  32.      */  
  33.     private void setXml2FrameAnim2() {  
  34.   
  35.         // 通过逐帧动画的资源文件获得AnimationDrawable示例  
  36.         animationDrawable = (AnimationDrawable) getResources().getDrawable(  
  37.                 R.drawable.frame_anim);  
  38.         imageView.setBackground(animationDrawable);  
  39.     }  
  40.    
  41.     @Override  
  42.     public void onClick(View v) {  
  43.   
  44.         switch (v.getId()) {  
  45.         case R.id.start:  
  46.             if (animationDrawable != null && !animationDrawable.isRunning()) {  
  47.                 animationDrawable.start();  
  48.             }  
  49.             break;  
  50.         case R.id.stop:  
  51.             if (animationDrawable != null && animationDrawable.isRunning()) {  
  52.                 animationDrawable.stop();  
  53.             }  
  54.             break;  
  55.   
  56.         default:  
  57.             break;  
  58.         }  
  59.     }  
  60.   
  61. }  

二、通过代码实现帧动画

[java]  view plain  copy
  1. /** 
  2.  * 通过代码添加帧动画方法 
  3.  */  
  4. private void setSrc2FrameAnim() {  
  5.   
  6.     animationDrawable = new AnimationDrawable();  
  7.     // 为AnimationDrawable添加动画帧  
  8.     animationDrawable.addFrame(  
  9.             getResources().getDrawable(R.drawable.img00), 50);  
  10.     animationDrawable.addFrame(  
  11.             getResources().getDrawable(R.drawable.img01), 50);  
  12.     animationDrawable.addFrame(  
  13.             getResources().getDrawable(R.drawable.img02), 50);  
  14.     animationDrawable.addFrame(  
  15.             getResources().getDrawable(R.drawable.img03), 50);  
  16.     animationDrawable.addFrame(  
  17.             getResources().getDrawable(R.drawable.img04), 50);  
  18.     animationDrawable.addFrame(  
  19.             getResources().getDrawable(R.drawable.img05), 50);  
  20.     animationDrawable.addFrame(  
  21.             getResources().getDrawable(R.drawable.img06), 50);  
  22.     animationDrawable.addFrame(  
  23.             getResources().getDrawable(R.drawable.img07), 50);  
  24.     animationDrawable.addFrame(  
  25.             getResources().getDrawable(R.drawable.img08), 50);  
  26.     animationDrawable.addFrame(  
  27.             getResources().getDrawable(R.drawable.img09), 50);  
  28.     animationDrawable.addFrame(  
  29.             getResources().getDrawable(R.drawable.img10), 50);  
  30.     animationDrawable.addFrame(  
  31.             getResources().getDrawable(R.drawable.img11), 50);  
  32.     animationDrawable.addFrame(  
  33.             getResources().getDrawable(R.drawable.img12), 50);  
  34.     animationDrawable.addFrame(  
  35.             getResources().getDrawable(R.drawable.img13), 50);  
  36.     animationDrawable.addFrame(  
  37.             getResources().getDrawable(R.drawable.img14), 50);  
  38.     animationDrawable.addFrame(  
  39.             getResources().getDrawable(R.drawable.img15), 50);  
  40.     animationDrawable.addFrame(  
  41.             getResources().getDrawable(R.drawable.img16), 50);  
  42.     animationDrawable.addFrame(  
  43.             getResources().getDrawable(R.drawable.img17), 50);  
  44.     animationDrawable.addFrame(  
  45.             getResources().getDrawable(R.drawable.img18), 50);  
  46.     animationDrawable.addFrame(  
  47.             getResources().getDrawable(R.drawable.img19), 50);  
  48.     animationDrawable.addFrame(  
  49.             getResources().getDrawable(R.drawable.img20), 50);  
  50.     animationDrawable.addFrame(  
  51.             getResources().getDrawable(R.drawable.img21), 50);  
  52.     animationDrawable.addFrame(  
  53.             getResources().getDrawable(R.drawable.img22), 50);  
  54.     animationDrawable.addFrame(  
  55.             getResources().getDrawable(R.drawable.img23), 50);  
  56.     animationDrawable.addFrame(  
  57.             getResources().getDrawable(R.drawable.img24), 50);  
  58.     // 设置为循环播放  
  59.     animationDrawable.setOneShot(false);  
  60.     imageView.setBackground(animationDrawable);  
  61. }  


点击下载源码


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值