Android动画之逐帧动画(Frame Animation)实例详解

本文实例分析了Android动画之逐帧动画。分享给大家供大家参考,具体如下:

在开始实例讲解之前,先引用官方文档中的一段话:

Frame动画是一系列图片按照一定的顺序展示的过程,和放电影的机制很相似,我们称为逐帧动画。Frame动画可以被定义在XML文件中,也可以完全编码实现。

如果被定义在XML文件中,我们可以放置在/res下的anim或drawable目录中(/res/[anim | drawable]/filename.xml),文件名可以作为资源ID在代码中引用;如果由完全由编码实现,我们需要使用到AnimationDrawable对象。

如果是将动画定义在XML文件中的话,语法如下:

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
  android:oneshot=["true" | "false"] >
  <item
    android:drawable="@[package:]drawable/drawable_resource_name"
    android:duration="integer" />
</animation-list>

需要注意的是:

<animation-list>元素是必须的,并且必须要作为根元素,可以包含一或多个<item>元素;android:onshot如果定义为true的话,此动画只会执行一次,如果为false则一直循环。
<item>元素代表一帧动画,android:drawable指定此帧动画所对应的图片资源,android:druation代表此帧持续的时间,整数,单位为毫秒。

文档接下来的示例我就不在解说了,因为接下来我们也要结合自己的实例演示一下这个过程。

我们新建一个名为anim的工程,将四张连续的图片分别命名为f1.png,f2.png,f3.png,f4.png,放于drawable目录,然后新建一个frame.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/f1" android:duration="300" />
  <item android:drawable="@drawable/f2" android:duration="300" />
  <item android:drawable="@drawable/f3" android:duration="300" />
  <item android:drawable="@drawable/f4" android:duration="300" />
</animation-list>

我们可以将frame.xml文件放置于drawable或anim目录,官方文档上是放到了drawable中了,大家可以根据喜好来放置,放在这两个目录都是可以运行的。

然后介绍一下布局文件res/layout/frame.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent">
 <ImageView
  android:id="@+id/frame_image"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:layout_weight="1"/>
 <Button
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:text="stopFrame"
  android:onClick="stopFrame"/>
 <Button
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:text="runFrame"
  android:onClick="runFrame"/>
</LinearLayout>

我们定义了一个ImageView作为动画的载体,然后定义了两个按钮,分别是停止和启动动画。

接下来介绍一下如何通过加载动画定义文件来实现动画的效果。我们首先会这样写:

package com.scott.anim;
import android.app.Activity;
import android.graphics.drawable.AnimationDrawable;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
public class FrameActivity extends Activity {
  private ImageView image;
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.frame);
    image = (ImageView) findViewById(R.id.frame_image);
    image.setBackgroundResource(R.anim.frame);
    AnimationDrawable anim = (AnimationDrawable) image.getBackground();
    anim.start();
  }
}

看似十分完美,跟官方文档上写的一样,然而当我们运行这个程序时会发现,它只停留在第一帧,并没有出现我们期望的动画,也许你会失望的说一句:“Why?”,然后你把相应的代码放在一个按钮的点击事件中,动画就顺利执行了,再移回到onCreate中,还是没效果,这个时候估计你会气急败坏的吼一句:“What the fuck!”。但是,什么原因呢?如何解决呢?

出现这种现象是因为当我们在onCreate中调用AnimationDrawable的start方法时,窗口Window对象还没有完全初始化,AnimationDrawable不能完全追加到窗口Window对象中,那么该怎么办呢?我们需要把这段代码放在onWindowFocusChanged方法中,当Activity展示给用户时,onWindowFocusChanged方法就会被调用,我们正是在这个时候实现我们的动画效果。当然,onWindowFocusChanged是在onCreate之后被调用的,如图:

然后我们需要重写一下代码:

package com.scott.anim;
import android.app.Activity;
import android.graphics.drawable.AnimationDrawable;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
public class FrameActivity extends Activity {
  private ImageView image;
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.frame);
    image = (ImageView) findViewById(R.id.frame_image);
  }
  @Override
  public void onWindowFocusChanged(boolean hasFocus) {
    super.onWindowFocusChanged(hasFocus);
    image.setBackgroundResource(R.anim.frame);
    AnimationDrawable anim = (AnimationDrawable) image.getBackground();
    anim.start();
  }
}

运行一下,动画就可以正常显示了。

如果在有些场合,我们需要用纯代码方式实现一个动画,我们可以这样写:

AnimationDrawable anim = new AnimationDrawable();
for (int i = 1; i <= 4; i++) {
  int id = getResources().getIdentifier("f" + i, "drawable", getPackageName());
  Drawable drawable = getResources().getDrawable(id);
  anim.addFrame(drawable, 300);
}
anim.setOneShot(false);
image.setBackgroundDrawable(anim);
anim.start();

完整的FrameActivity.java代码如下:

package com.scott.anim;
import android.app.Activity;
import android.graphics.drawable.AnimationDrawable;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
public class FrameActivity extends Activity {
  private ImageView image;
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.frame);
    image = (ImageView) findViewById(R.id.frame_image);
  }
  @Override
  public void onWindowFocusChanged(boolean hasFocus) {
    super.onWindowFocusChanged(hasFocus);
    image.setBackgroundResource(R.anim.frame); //将动画资源文件设置为ImageView的背景
    AnimationDrawable anim = (AnimationDrawable) image.getBackground(); //获取ImageView背景,此时已被编译成AnimationDrawable
    anim.start();  //开始动画
  }
  public void stopFrame(View view) {
    AnimationDrawable anim = (AnimationDrawable) image.getBackground();
    if (anim.isRunning()) { //如果正在运行,就停止
      anim.stop();
    }
  }
  public void runFrame(View view) {
    //完全编码实现的动画效果
    AnimationDrawable anim = new AnimationDrawable();
    for (int i = 1; i <= 4; i++) {
      //根据资源名称和目录获取R.java中对应的资源ID
      int id = getResources().getIdentifier("f" + i, "drawable", getPackageName());
      //根据资源ID获取到Drawable对象
      Drawable drawable = getResources().getDrawable(id);
      //将此帧添加到AnimationDrawable中
      anim.addFrame(drawable, 300);
    }
    anim.setOneShot(false); //设置为loop
    image.setBackgroundDrawable(anim); //将动画设置为ImageView背景
    anim.start();  //开始动画
  }
}

希望本文所述对大家Android程序设计有所帮助。

时间: 2016-01-03

Android图片翻转动画简易实现代码

下面给大家分享一个有趣的动画:这里比较适合一张图片的翻转,如果是多张图片,可以参考APIDemo里的例子,就是加个ArrayAdapter,还是简单的,也可以自己发挥修改,实现自己想要的.这里的代码基本上可以直接运行项目了. 在main.xml里加个ImageView,如 复制代码 代码如下: <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http:/

Android实现Activity界面切换添加动画特效的方法

本文以实例形式展示了Android实现Activity界面切换添加动画特效的方法,对于Android程序设计人员来说有很好的参考借鉴价值.具体方法如下: 了解Android程序设计的人应该知道,在Android 2.0之后有了overridePendingTransition(),其中里面两个参数,一个是前一个activity的退出,另一个activity的进入. 现看看下面这段示例代码: @Override public void onCreate(Bundle savedInstanceSt

Android 3D旋转动画效果实现分解

这篇文章主要介绍一下如何实现View的3D旋转效果,实现的主要原理就是围绕Y轴旋转,同时在Z轴方面上有一个深入的缩放. 演示的demo主要有以下几个重点: 1,自定义旋转动画 2,动画做完后,重置ImageView 先看一下程序的运行效果:  1,自定义动画类 这里实现了一个Rotate3dAnimation的类,它扩展了Animation类,重写applyTransformation()方法,提供指定时间的矩阵变换,我们在这个方法里,就可以利用Camera类得得到一个围绕Y轴旋转的matrix

Android 使用XML做动画UI的深入解析

效果: http://www.56.com/u82/v_OTM4MDk5MTk.html第一步: 创建anim文件夹放置动画xml文件在res文件夹下,创建一个anim的子文件夹. 第二步: 加载动画接着在Activity创建一个Animation类,然后使用AnimationUtils类加载动画xml 复制代码 代码如下: Animation animFadein; @Overrideprotected void onCreate(Bundle savedInstanceState) { su

Android动画之3D翻转效果实现函数分析

Android中的翻转动画效果的实现,首先看一下运行效果如上图所示. Android中并没有提供直接做3D翻转的动画,所以关于3D翻转的动画效果需要我们自己实现,那么我们首先来分析一下Animation 和 Transformation. Animation动画的主要接口,其中主要定义了动画的一些属性比如开始时间,持续时间,是否重复播放等等.而Transformation中则包含一个矩阵和alpha值,矩阵是用来做平移,旋转和缩放动画的,而alpha值是用来做alpha动画的,要实现3D旋转动画

Android 动画之ScaleAnimation应用详解

android中提供了4中动画: AlphaAnimation 透明度动画效果 ScaleAnimation 缩放动画效果 TranslateAnimation 位移动画效果 RotateAnimation 旋转动画效果 本节讲解ScaleAnimation 动画, ScaleAnimation(float fromX, float toX, float fromY, float toY,int pivotXType, float pivotXValue, int pivotYType, flo

三款Android炫酷Loading动画组件推荐

最近突然心血来潮,对一些Loading感兴趣,Loading这玩意说重要也重要,说不重要也不重要,因为这是一个提升你产品体验的一个细节,如果loading做的好,对于一些耗时需要用户等待的页面来说会转移用户注意力,不会显得那么烦躁,所以你可以看到市面上各种各样好玩的Loading动画,那么这篇博客就准备收集下一些Loading动画吧,从这些实现思路上可以打开你们自己的思维,没准也会有创新好玩的Loading动画出现. 暂且先列举些最近GitHub新鲜出炉的Loading CircleProgre

Android 动画之TranslateAnimation应用详解

android中提供了4中动画: AlphaAnimation 透明度动画效果 ScaleAnimation 缩放动画效果 TranslateAnimation 位移动画效果 RotateAnimation 旋转动画效果 本节讲解TranslateAnimation动画,TranslateAnimation比较常用,比如QQ,网易新闻菜单条的动画,就可以用TranslateAnimation实现, 通过TranslateAnimation(float fromXDelta, float toXD

Android开发简单实现摇动动画的方法

本文实例讲述了Android开发简单实现摇动动画的方法.分享给大家供大家参考,具体如下: 1.先创建shake.xml <?xml version="1.0" encoding="utf-8"?> <translate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="700" android:fromXD

Android的Activity跳转动画各种效果整理

大家使用Android的原生UI都知道,Android的Activity跳转就是很生硬的切换界面.其实Android的Activity跳转可以设置各种动画.下面给大家看看效果:  实现非常简单,用overridePendingtransition(int inId, int outId)即可实现.inId是下一界面进入效果的xml文件的id,outId是当前界面退出效果的xml文件id. 效果是用xml文件写的,首先要在res文件夹下建立anim文件夹,然后把动画效果xml文件放到里面去. 下面

Android Activity跳转动画效果

Activity的跳转动画在5.0的时候做了一个重大的突破,下面来看一下吧 1.5.0之前的overridePendingTransition 相信大家对OverridePendingTransition还是很熟悉的,使用方法也是很简单就是 //fade_in是第二个界面的进入动画,fade_out是第一个界面退出动画,不想动画传入0  overridePendingTransition(R.anim.fade_in,R.anim.fade_out); fade_in : <?xml versi

Android中activity跳转按钮事件的四种写法

具体实现代码: public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // 方法1. 采用实现OnClickListener接口的类 ((Button) findViewById(R.i

Android实现长按圆环动画View效果的思路代码

一.需求来源 最近想到一个需求,类似悦跑圈或者Keep的结束按钮动画 二.思路代码 该动画按钮的主要作用就是防止用户误操作,具体实现思路如下: 1.监听用户的触摸事件OnTouchListener,在ACTION_DOWN的时候,记录下xy坐标和触摸时间,同时start自定义View动画:在ACTION_MOVE的过程中,判断坐标差值的偏移量是否在一个可接受的范围内,是的话就保留当前动画,不是的话就清除按钮上绘制的path:在ACTION_UP的时候,再次记录下触摸时间,比较两个时间是否达到了长

Android中Activity跳转的创建步骤总结

一.创建工程 file->new->android application依次填入应用名称.工程名.包名 在工程目录下找到src/com.example.helloworld MainActivity.java 二.添加代码 复制代码 代码如下: package com.example.helloworld; import android.app.Activity; import android.content.Intent; import android.os.Bundle; import

android的activity跳转到另一个activity

开发环境:android4.1.1 实验功能:在第一个Hello World!为标签的activity中显示good,该界面中有一个名为Next的按钮.点击Next按钮进入到第二个activity中去,第二个界面中只有1个Close按钮.当然,据网上有人将要比较安全的实现关闭程序的功能也不是挺简单的,因为android有专门的退出键返回键等.所以该Close按钮暂时没去实现它.我的第1个activity为HelloworldActivity,第2个activity为NextActivity. 实

Android基础知识之frame动画效果

上一篇我们说了Android中的tween动画,这一篇我们说说frame动画,frame动画主要是实现了一种类似于gif动画的效果,就是多张图按预先设定好的时间依次连续显示. 新建一个android项目,名字叫做frameTest,在res文件夹下新建一个文件夹叫做anim,我们的frame动画的xml文件就放在这里. 在anim中新建一个frame.xml文件,内容如下: <?xml version="1.0" encoding="utf-8"?> &

Android中Activity滑动关闭的效果

最近感觉有一个Activity关闭的效果挺不错的,就是手势滑动就可以关闭当前Activity,于是就想写一篇博客和大家一起分享下!废话不多说,老规矩,还先上效果图,更直观! 项目地址:https://github.com/xinyitiandi/SlidingFinishDemo 上代码: 1.第一个Activity: package com.ekeguan.slidingfinishdemo; import android.content.Intent; import android.os.B

Android编程实现ActionBar的home图标动画切换效果

本文实例讲述了Android编程实现ActionBar的home图标动画切换效果.分享给大家供大家参考,具体如下: Material Design中一个重要特性是侧滑菜单 展开/关闭 时,ActionBar上的home图标也动画切换.本例要实现的正是这个效果,如图所示: 实现这个效果仅需几步: 1.首先,该页面的布局是一个DrawerLayout,代码如下: <android.support.v4.widget.DrawerLayout xmlns:android="http://sche