`

Android】Android动画入门Animation 、AnimationUtils

 
阅读更多

本讲内容：Android 动画入门指南 
1、补间动画 
2、逐帧动画

Android中动画的实现分两种方式，一种方式是补间动画 Teen Animation，就是说你定义一个开始和结束，中间的部分由程序运算得到。另一种叫逐帧动画 Frame Animation，就是说一帧一帧的连起来播放就变成了动画。有点Flash基础的同学理解起来会很容易。接下来我们一个一个学习。

一、补间动画 Teen Animation

Android中实现补间动画的思路是这样的， 
1、首先用XML定义一个动画效果 
2、依据这个XML使用AnimationUtils工具类创建一个Animationd对象 
3、调用View组件的startAnimation方法实现动画。

接下来我们用一个例子来看一下。

1、创建一个项目 Lesson24_Animation，主Activity名字叫MainActivity.java

2、在res目录下创建一个anim目录，在目录下创建下面五个动画定义文件，需要注意的是这5个文件在是2.2下调试通过的，网上很多文档的xml是无法通过IDE的检查的，可能是新版本检查更严格了。

alpha_animation.xml

1 <?xml version="1.0" encoding="utf-8"?>
2 <set>
3 <alpha android:duration="300" android:toalpha="1.0" android:fromalpha="0.5"android:repeatmode="restart" android:repeatcount="1"android:interpolator="@android:anim/accelerate_interpolator"xmlns:android="http://schemas.android.com/apk/res/android">
4 <alpha android:duration="3000" android:toalpha="1.0" android:fromalpha="0.5"android:repeatmode="restart" android:repeatcount="0"android:interpolator="@android:anim/accelerate_interpolator"xmlns:android="http://schemas.android.com/apk/res/android">
5 </alpha></alpha></set>

 

composite_animation.xml

1 <set xmlns:android="http://schemas.android.com/apk/res/android"android:shareinterpolator="false">
2    <scale android:duration="700"android:interpolator="@android:anim/accelerate_decelerate_interpolator"xmlns:android="http://schemas.android.com/apk/res/android" android:fillafter="false"android:pivoty="50%" android:pivotx="50%" android:toyscale="0.6"android:fromyscale="1.0" android:toxscale="1.4" android:fromxscale="1.0">
3    </scale></set><set android:interpolator="@android:anim/decelerate_interpolator">
4       <scale android:duration="400"xmlns:android="http://schemas.android.com/apk/res/android" android:pivoty="50%"android:pivotx="50%" android:toyscale="0.0" android:fromyscale="0.6"android:toxscale="0.0" android:fromxscale="1.4" android:fillbefore="false"android:startoffset="700">
5       <rotate android:duration="400"xmlns:android="http://schemas.android.com/apk/res/android" android:pivoty="50%"android:pivotx="50%" android:toyscale="0.0" android:startoffset="700"android:todegrees="-45" android:fromdegrees="0">
6    </rotate></scale></set>

 

rotate_animation.xml

1 <?xml version="1.0" encoding="utf-8"?>
2 <set>
3  <rotate android:duration="4000"android:interpolator="@android:anim/decelerate_interpolator"xmlns:android="http://schemas.android.com/apk/res/android" android:pivoty="50%"android:pivotx="50%" android:todegrees="-1440" android:fromdegrees="0">
4  </rotate>
5 </set>

 

scale_animation.xml

1 <?xml version="1.0" encoding="utf-8"?>
2 <set>
3     <scale android:duration="1000"android:interpolator="@android:anim/decelerate_interpolator"xmlns:android="http://schemas.android.com/apk/res/android" android:fillafter="false"android:pivoty="100%" android:pivotx="0%" android:toyscale="1.0"android:fromyscale="0.0" android:toxscale="1.0" android:fromxscale="0.0">
4     </scale>
5     <scale android:duration="1000"android:interpolator="@android:anim/decelerate_interpolator"xmlns:android="http://schemas.android.com/apk/res/android" android:fillafter="false"android:pivoty="50%" android:pivotx="50%" android:toyscale="1.0"android:fromyscale="0.0" android:toxscale="1.0" android:fromxscale="0.0">
6     </scale>
7 </set>

 

translate_animation.xml

1 <?xml version="1.0" encoding="utf-8"?>
2 <set>
3 <translate android:duration="2000"android:interpolator="@android:anim/decelerate_interpolator"xmlns:android="http://schemas.android.com/apk/res/android" android:toydelta="0"android:fromydelta="0" android:toxdelta="300" android:fromxdelta="0">
4  </translate>
5 <translate android:duration="2000"android:interpolator="@android:anim/decelerate_interpolator"xmlns:android="http://schemas.android.com/apk/res/android"android:startoffset="2000" android:toydelta="0" android:fromydelta="0"android:toxdelta="-300" android:fromxdelta="0">
6  </translate>
7 </set>

 

3、MainActivity.java的内容如下：

01 package android.basic.lesson24;
02  
03 import android.app.Activity;
04 import android.os.Bundle;
05 import android.view.View;
06 import android.view.View.OnClickListener;
07 import android.view.animation.Animation;
08 import android.view.animation.AnimationUtils;
09 import android.widget.ImageButton;
10  
11 public class MainAnimation extends Activity {
12     /** Called when the activity is first created. */
13     @Override
14     public void onCreate(Bundle savedInstanceState) {
15         super.onCreate(savedInstanceState);
16         setContentView(R.layout.main);
17  
18         //定义UI组件
19         final ImageButton ib1 = (ImageButton) findViewById(R.id.ImageButton01);
20         final ImageButton ib2 = (ImageButton) findViewById(R.id.ImageButton02);
21         final ImageButton ib3 = (ImageButton) findViewById(R.id.ImageButton03);
22         final ImageButton ib4 = (ImageButton) findViewById(R.id.ImageButton04);
23         final ImageButton ib5 = (ImageButton) findViewById(R.id.ImageButton05);
24  
25         //定义监听器
26         OnClickListener ocl = new OnClickListener() {
27  
28             @Override
29             public void onClick(View v) {
30                 switch (v.getId()) {
31                 case R.id.ImageButton01:
32                     //创建Animation对象
33                     Animation ani1 = AnimationUtils.loadAnimation(
34                             getApplicationContext(), R.anim.alpha_animation);
35                     //组件播放动画
36                     ib1.startAnimation(ani1);
37                     break;
38                 case R.id.ImageButton02:
39                     Animation ani2 = AnimationUtils.loadAnimation(
40                             getApplicationContext(), R.anim.scale_animation);
41                     ib2.startAnimation(ani2);
42                     break;
43                 case R.id.ImageButton03:
44                     Animation ani3 = AnimationUtils.loadAnimation(
45                             getApplicationContext(), R.anim.translate_animation);
46                     ib3.startAnimation(ani3);
47                     break;
48                 case R.id.ImageButton04:
49                     Animation ani4 = AnimationUtils.loadAnimation(
50                             getApplicationContext(), R.anim.rotate_animation);
51                     ib4.startAnimation(ani4);
52                     break;
53                 case R.id.ImageButton05:
54                     Animation ani5 = AnimationUtils.loadAnimation(
55                             getApplicationContext(), R.anim.composite_animation);
56                     ib5.startAnimation(ani5);
57                     break;
58                 }
59  
60             }
61  
62         };
63  
64         //绑定监听器
65         ib1.setOnClickListener(ocl);
66         ib2.setOnClickListener(ocl);
67         ib3.setOnClickListener(ocl);
68         ib4.setOnClickListener(ocl);
69         ib5.setOnClickListener(ocl);
70     }
71 }

 

4、运行程序，查看结果

image

原始图

image

点击第一个按钮的透明度变化效果

image

点击第二个按钮的缩放效果，这里看到的是两个缩放效果同时作用叠加的效果。也就是说默认情况下效果是同时发生的，而不是先后执行的，除非你使用 startoffset属性指定。同学们看这一讲最重要的还是自己练习来体会。

 image   
点击第三个按钮的位移效果，这个例子里我们可以清楚看到android:startOffset="2000"的作用，数独按钮前2秒向右移了300像素，后2秒又回到原处，注意第二个translate中的负值参数，它清晰的告诉我们位移数据是相对自身当时位置的。

 

 

image  
点击第四个按钮的旋转效果，负的度数表示逆时针旋转。

image  
点击第五个按钮的复合动画效果，这个效果的代码我是直接粘贴的官方帮助文档里的代码，看着效果还不赖^_^

二、逐帧动画

我们知道，Android是不支持Gif动画的，也不建议使用Gif动画，比较不幸的是到Android 2.2版本为止也不支持APNG这种png动画格式，所以我们制作只能用多张png图片逐帧播放的方式来实现动画效果。下面我们用一个例子来学习一下逐帧动画。

1、新建一个项目 Lesson24_FrameAnimation , 主Acitivy名字叫 MainFrameAnimation.java

2、拷贝下列图片到 res/drawable目录下

firefox_animation_0 firefox_animation_1 firefox_animation_10 firefox_animation_11 firefox_animation_12 firefox_animation_13 firefox_animation_14 firefox_animation_15 firefox_animation_16 firefox_animation_17 firefox_animation_18 firefox_animation_19 firefox_animation_2 firefox_animation_20 firefox_animation_21 firefox_animation_22 firefox_animation_23 firefox_animation_24 firefox_animation_3 firefox_animation_4 firefox_animation_5 firefox_animation_6 firefox_animation_7 firefox_animation_8 firefox_animation_9

2、在res/anim目录下，新建一个文件 firefox_animation.xml 内容如下：

01 <?xml version="1.0" encoding="utf-8"?>
02  <animation -list="" xmlns:android="http://schemas.android.com/apk/res/android"android:oneshot="false">
03     <item android:duration="50" android:drawable="@drawable/firefox_animation_0">
04     <item android:duration="50" android:drawable="@drawable/firefox_animation_1">
05     <item android:duration="50" android:drawable="@drawable/firefox_animation_2">
06     <item android:duration="50" android:drawable="@drawable/firefox_animation_3">
07     <item android:duration="50" android:drawable="@drawable/firefox_animation_4">
08     <item android:duration="50" android:drawable="@drawable/firefox_animation_5">
09     <item android:duration="50" android:drawable="@drawable/firefox_animation_6">
10     <item android:duration="50" android:drawable="@drawable/firefox_animation_7">
11     <item android:duration="50" android:drawable="@drawable/firefox_animation_8">
12     <item android:duration="50" android:drawable="@drawable/firefox_animation_9">
13     <item android:duration="50" android:drawable="@drawable/firefox_animation_10">
14     <item android:duration="50" android:drawable="@drawable/firefox_animation_11">
15     <item android:duration="50" android:drawable="@drawable/firefox_animation_12">
16     <item android:duration="50" android:drawable="@drawable/firefox_animation_13">
17     <item android:duration="50" android:drawable="@drawable/firefox_animation_14">
18     <item android:duration="50" android:drawable="@drawable/firefox_animation_15">
19     <item android:duration="50" android:drawable="@drawable/firefox_animation_16">
20     <item android:duration="50" android:drawable="@drawable/firefox_animation_17">
21     <item android:duration="50" android:drawable="@drawable/firefox_animation_18">
22     <item android:duration="50" android:drawable="@drawable/firefox_animation_19">
23     <item android:duration="50" android:drawable="@drawable/firefox_animation_20">
24     <item android:duration="50" android:drawable="@drawable/firefox_animation_21">
25     <item android:duration="50" android:drawable="@drawable/firefox_animation_22">
26     <item android:duration="50" android:drawable="@drawable/firefox_animation_23">
27     <item android:duration="50" android:drawable="@drawable/firefox_animation_24">
28 </item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></item></animation>

 

3、在res/layout/main.xml中写入如下内容：

01 <?xml version="1.0" encoding="utf-8"?>
02 <linearlayout xmlns:android="http://schemas.android.com/apk/res/android"android:orientation="vertical" android:layout_width="fill_parent"android:layout_height="fill_parent">
03  
04     <textview android:layout_width="fill_parent"android:layout_height="wrap_content" android:textsize="20sp" android:text="Android逐帧动画示例">
05  
06     <imageview android:layout_width="wrap_content"android:layout_height="wrap_content" android:layout_margin="10dp"android:id="@+id/ImageView01" android:background="@anim/firefox_animation">
07     </imageview>
08  
09     <button android:layout_width="wrap_content" android:layout_height="wrap_content"android:textsize="20sp" android:text="开始动画" android:id="@+id/Button01">
10     </button>
11     <button android:layout_width="wrap_content" android:layout_height="wrap_content"android:textsize="20sp" android:text="停止动画" android:id="@+id/Button02">
12     </button>
13 </textview></linearlayout>

 

3、在MainFrameAnimation.javaz中的内容如下：

01 package android.basic.lesson24;
02  
03 import android.app.Activity;
04 import android.graphics.drawable.AnimationDrawable;
05 import android.os.Bundle;
06 import android.view.View;
07 import android.view.View.OnClickListener;
08 import android.widget.Button;
09 import android.widget.ImageView;
10  
11 public class MainFrameAnimaton extends Activity {
12     /** Called when the activity is first created. */
13     @Override
14     public void onCreate(Bundle savedInstanceState) {
15         super.onCreate(savedInstanceState);
16         setContentView(R.layout.main);
17  
18         // 定义UI组件
19         Button b1 = (Button) findViewById(R.id.Button01);
20         Button b2 = (Button) findViewById(R.id.Button02);
21         final ImageView iv = (ImageView) findViewById(R.id.ImageView01);
22  
23         // 定义点击监听器
24         OnClickListener ocl = new OnClickListener() {
25  
26             @Override
27             public void onClick(View v) {
28  
29                 // 定义"动画可画"对象，我起的名字，你看着不顺眼就当不存在^_^
30                 AnimationDrawable ad = (AnimationDrawable) iv.getBackground();
31  
32                 switch (v.getId()) {
33                 case R.id.Button01:
34                     //调用动画可画对象的开始播放方法
35                     ad.start();
36                     break;
37                 case R.id.Button02:
38                     //调用动画可画对象的停止播放方法
39                     ad.stop();
40                     break;
41                 }
42             }
43         };
44  
45         //绑定监听器
46         b1.setOnClickListener(ocl);
47         b2.setOnClickListener(ocl);
48     }
49 }

 

4、运行程序，查看效果：

image

image

换个背景再来一张，可以看到png动画的透明就是不一般^_^

image

顺便提一下，我的这些可爱的小狐狸图标，是在APNG这个项目中找到的，感兴趣的朋友去搜搜APNG吧。

本讲就到这里吧。

 

 

图片直接链接的，显示不了的话，去源地址看吧。

转载自:  http://android.yaohuiji.com/archives/tag/animationutils

分享到：
| Android startActivityForResult的使用
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    Android 补间动画（Animation）

    ### Android 补间动画（Animation） #### 概述 Android中的补间动画（Tween Animation），是一种常见的动画形式，主要用于模拟物体在屏幕上移动、缩放、旋转等效果。它不涉及对象的实际位置变化，而是通过一系列...

    Android常见的补间Animation动画集合

    补间Animation是Android系统提供的一种基本动画机制，用于实现平滑的视觉变化效果。本篇文章将详细探讨Android中的补间Animation，包括其基本概念、使用方法以及如何实现Activity切换动画。 1. 补间Animation的基本...

    Android动画效果--渐变动画

    Animation alphaAnim = AnimationUtils.loadAnimation(context, R.anim.fade_out); view.startAnimation(alphaAnim); ``` 总之，Android的渐变动画提供了丰富的视觉效果，通过Java代码或XML资源文件可以灵活地...

    android动画效果animation

    Android支持两种主要的动画类型：属性动画（Property Animation）和视图动画（View Animation）。属性动画是自Android 3.0（API级别11）引入的新机制，它允许对对象的任意属性进行动画处理，不仅限于视图。视图动画...

    Android的动画Animation详解

    ### Android的动画Animation详解 #### 一、动画概述 Android平台提供了丰富的动画支持，通过不同的方式可以实现多种视觉效果，从而提升用户体验。Android动画主要分为两大类：Tween动画（渐变动画）和Frame-by-...

    Android中补间动画TweenAnimation

    在Android开发中，补间动画（Tween Animation）是动画系统的一部分，用于实现对象在屏幕上位置、大小、透明度等属性的变化。补间动画基于帧，通过连续改变对象属性来创建平滑过渡效果，使得视觉上产生动画的效果。...

    Android吸入动画效果

    Animation animation = AnimationUtils.loadAnimation(this, R.anim.吸入口动画); View targetView = findViewById(R.id.target_view); targetView.startAnimation(animation); ``` 这里，`loadAnimation`方法用于...

    Android动画之仿美团加载数据等待时小人奔跑进度动画 程序源码

    在Android中，动画可以分为两种主要类型：补间动画（Tween Animation）和帧动画（Frame Animation）。在这个项目中，我们可能会用到补间动画，因为它更适合模拟连续的平滑动作，比如小人的奔跑。 补间动画是通过...

    android Animation图片渐变动画 Demo

    首先，"android Animation图片渐变动画"指的是在Android平台上，通过编程方式让图片从一种状态平滑地过渡到另一种状态，这通常涉及到Alpha（透明度）动画、Scale（缩放）动画、Rotate（旋转）或Translate（平移）...

    Android 积分签到动画 位移+透明 Android签到动画效果 签到上移消失动画效果

    - 代码实现时，可以使用`AnimationUtils.loadAnimation()`加载动画资源，或者直接创建`TranslateAnimation`对象并设置参数。 2. **透明度动画原理**： - XML中，`&lt;alpha&gt;`标签用于定义透明度动画。`android:...

    Android 翻转动画 ，像硬币一样的翻转动画

    首先，Android提供了两种主要类型的动画：补间动画（Tween Animation）和帧动画（Frame Animation）。在这个案例中，我们将关注补间动画，因为它们更适合实现翻转效果。补间动画可以通过XML文件定义，并在代码中应用...

    Android Animation动画资源文件

    Android Animation主要分为两大类：补间动画(Tween Animation)和帧动画(Frame Animation)。本资源文件主要关注补间动画，这是一种通过改变对象属性（如位置、大小、透明度等）在一段时间内平滑过渡的动画效果。 补...

    Android使用ViewFlipper实现Switch动画特效。

    在Android中，有两种主要类型的动画：属性动画（Property Animation）和视图动画（View Animation）。视图动画较为简单，适用于API等级较低的设备，而属性动画则提供了更强大的功能，可以改变对象的任意属性。对于...

    Android三种动画的基本实现总结

    在Android中，我们可以通过`Animation`类及其子类（如`TranslateAnimation`、`ScaleAnimation`、`RotateAnimation`和`AlphaAnimation`）来创建补间动画。以一个简单的平移动画为例： ```xml &lt;translate xmlns:...

    安卓动画效果相关-基于android旋转动画做的摇晃铃铛的动画效果代码很简单注释很简单可直接集成在项目中非常好用.rar

    首先，Android中的动画分为属性动画（Property Animation）和视图动画（View Animation）两种。视图动画是早期版本Android系统中使用的，主要通过改变视图的显示状态来模拟动画效果，而属性动画则是在Android 3.0...

    Android圆形向外扩散颜色渐浅动画

    Android提供了多种动画类型，包括补间动画（Tween Animation）和帧动画（Frame Animation）。对于这个案例，我们主要关注补间动画，因为它可以实现颜色变化和形状变换的效果。 1. **补间动画**： 补间动画是通过...

    Android逐帧(Frame)动画

    在Android平台上，动画是应用程序中不可或缺的一部分，可以增强用户体验并为用户提供吸引人的视觉效果。其中，"逐帧动画"（Frame Animation）是一种简单且常用的技术，适用于创建一系列连续的静态图像来模拟动态效果...

    android自动播放动画

    首先，Android提供了两种主要的动画机制：属性动画（Property Animation）和视图动画（View Animation）。属性动画是Android 3.0（API Level 11）及更高版本引入的，它允许对对象的任何属性进行动画处理，而不仅仅是...

    Android 加入购物车动画

    Android提供了多种动画类型，如帧动画（Frame Animation）、补间动画（Tween Animation）和属性动画（Property Animation）。在这个场景中，我们可能会用到属性动画，因为它允许对对象的属性进行平滑的改变，非常...

    Android 初始欢迎界面淡出动画效果

    Android提供了两种类型的动画：补间动画（Tween Animation）和帧动画（Frame Animation）。补间动画主要用于改变对象的属性，如平移、旋转、缩放和透明度等，而帧动画则适用于播放一系列静态图片形成连续动态效果。...

Magicbox
Global site tag (gtag.js) - Google Analytics