android中的tween动画(也叫view动画)原理以及使用详解

来源:互联网 发布:java分布式开发书 编辑:程序博客网 时间:2024/04/29 08:07

今天给朋友讲解了下tween动画(也叫view动画)的使用,讲的较为详细,想想不如写个博客让朋友回了家也能看,所以产生了想写博客记录的冲动。今后如果还有问题,我也会一一把博客写下来,方便朋友们的阅读和学习。


废话少说,直接上干货:
android中的动画 目前有三种动画,而我今天要讲的是其中的一种,也是我们编程时使用的最多的,就是tween动画,有人也叫view动画,这个动画呢他共有4种
分别是
Alpha:透明度动画
Scale:缩放动画T
ranslate:平移动画
Rotate:旋转动画
这些动画呢,自己能够单独执行,也能够通过set来集中在一起,一起执行,这个set可不是JAVA中的set,而是AnimationSet,当然你也可以理解成JAVA下边的set,因为他能够往里面addAnimation也就是添加动画,添加完成之后,就能让指定的组件来使用这个动画了

那么问题来了

这些动画怎么创建 然后 使用呢


 其实android推荐我们最好是写xml的动画来使用,这样做的好处是动画和java代码能够区分开,思维清晰,而且写法也很简单

那么怎么创建xml动画呢?
so easy
在res目录下创建一个anim的文件夹,然后右键这个文件夹,创建Android xml file 这样的文件,然后选择一种你想要写的动画就可以了 
如果你想选择其中一种动画,那么选




Alpha:透明度动画
Scale:缩放动画
Translate:平移动画
Rotate:旋转动画
的一种就可以了,如果你想做稍微复杂的动画就用到set了




因为set里面可以定义多个动画,包括上方四个动画也包括set本身




下方是scale动画的代码

<span style="font-family: Arial, Helvetica, sans-serif;"><?xml version="1.0" encoding="utf-8"?></span>
<!-- android:fromXScale="1.0" 开始时候x轴的比例大小,1.0代表原图大小android:toXScale="0.5"结束时候x轴的比例大小android:fromYScale="1.0" 开始时候y轴的比例大小,1.0代表原图大小android:toYScale="0.5"结束时候y轴的比例大小android:pivotX="50%"android:pivotY="50%" 相对于哪个中心缩放android:interpolator="@android:anim/linear_interpolator"控制动画速度linear_interpolator是匀速的意思android:duration=""控制动画的时长android:repeatCount="infinite" 控制循环次数android:repeatMode="reverse" 控制循环的模式reverse代表倒着来,restart代表重新开始--><!-- scale 是缩放动画--><scale    android:fromXScale="1.0"    android:toXScale="0.5"    android:fromYScale="1.0"    android:toYScale="0.5"    android:pivotX="50%"    android:pivotY="50%"    android:interpolator="@android:anim/linear_interpolator"    android:duration="3000"    android:repeatCount="infinite"    android:repeatMode="reverse"    xmlns:android="http://schemas.android.com/apk/res/android"></scale>
下方是平移动画的代码
<?xml version="1.0" encoding="utf-8"?><!-- translate 平移动画android:fromXDelta="0"是开始时候x轴的坐标  0代表原来的位置android:toXDelta="200"结束时候x轴的坐标android:fromYDelta="0"是开始时候y轴的坐标  0代表原来的位置android:toYDelta="200"结束时候y轴的坐标android:interpolator="@android:anim/linear_interpolator"控制速度 这个值是匀速android:duration="3000"动画时长 android:repeatCount="3"循环的次数android:repeatMode="reverse"循环的模式这个是倒着来--><translate    android:fromXDelta="0"    android:toXDelta="-300"    android:fromYDelta="0"    android:toYDelta="-500"    android:interpolator="@android:anim/linear_interpolator"    android:duration="3000"    android:repeatCount="infinite"    android:repeatMode="reverse"    xmlns:android="http://schemas.android.com/apk/res/android"></translate>
下方是透明度动画的代码

<?xml version="1.0" encoding="utf-8"?><!-- 这就是控制透明度变换的一个动画 --><!-- 从那个透明度开始android:fromAlpha=""到什么透明度截至android:toAlpha=""他们的值是从0到1之间的所有值android:interpolator="@android:anim/linear_interpolator"是匀速变化的android:interpolator="@android:anim/accelerate_interpolator"这个是加速动画android:interpolator="@android:anim/decelerate_interpolator"这是减速动画android:duration="3000"动画的时长android:repeatCount="5"重复的次数android:repeatCount="infinite"一直重复  infiniteandroid:repeatMode="reverse"重复的模式 如果是reverse那么就是动画倒过来执行  如果是restart那么就是重新执行 --><alpha    android:fromAlpha="1"    android:toAlpha="0"    android:interpolator="@android:anim/linear_interpolator"    android:duration="6000"    android:repeatCount="infinite"    android:repeatMode="reverse"    xmlns:android="http://schemas.android.com/apk/res/android"></alpha>
下方是旋转动画的代码
<?xml version="1.0" encoding="utf-8"?><!-- android:fromDegrees=""从那个角度开始取值范围 0 -360度android:toDegrees="360"到那个角度截至android:pivotX=""android:pivotY=""  这俩是以哪个为中心旋转  android:interpolator=""设置速度的一般设置匀速@android:anim/linear_interpolatorandroid:duration="6000" 动画延续时长 android:repeatCount=""      android:repeatCount="infinite"是转无限次android:repeatMode="" 重复动画的模式  是重新来一次   还是到这来 --><rotate    android:fromDegrees="0"    android:toDegrees="360"    android:pivotX="50%"    android:pivotY="50%"    android:interpolator="@android:anim/linear_interpolator"    android:repeatCount="infinite"    android:duration="6000"    android:repeatMode="reverse"    xmlns:android="http://schemas.android.com/apk/res/android"></rotate>
写完这些代码后,就需要在代码里面把这些动画导入进去

以下是java代码

import android.app.Activity;import android.os.Bundle;import android.view.animation.Animation;import android.view.animation.AnimationSet;import android.view.animation.AnimationUtils;import android.widget.ImageView;public class MainActivity extends Activity {    private ImageView iv;private Animation alphaAnim;private Animation rotateAnim;@Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initView();//找id的方法        initAnim();//初始化动画    }//自己创建的方法private void initAnim() {alphaAnim = AnimationUtils.loadAnimation(MainActivity.this, R.anim.alpha_anim);//开启动画rotateAnim = AnimationUtils.loadAnimation(MainActivity.this, R.anim.rotate_anim);AnimationSet set=new AnimationSet(MainActivity.this, null);set.addAnimation(alphaAnim);set.addAnimation(rotateAnim);iv.startAnimation(set);}private void initView() {iv = (ImageView) findViewById(R.id.iv);}}
其中
AnimationUtils.loadAnimation
可以把布局文件中的xml动画导入到java代码,那么java代码就可以使用这个动画了,

其中创建了个AnimationSet把几个动画组成一块,然后设置给被操作对象


下一步就是找到要操作的组件,这里我找的是imageview,然后给imageview设置了动画

iv.startAnimation(set);
这样动画就被设置给了imagview而且可以执行动画了。


这样做还是有些复杂,于是我把我要写的动画搞成了这个样子

<?xml version="1.0" encoding="utf-8"?><!-- set所有动画的集合 可以把所有动画包在这里边android:shareInterpolator="true"是否分享这个控制速度的东西 true是 false 不是android:interpolator="@android:anim/linear_interpolator" 创建了一个速度控制器android:duration="5000" 时长--><set    android:shareInterpolator="true"    android:interpolator="@android:anim/linear_interpolator"    xmlns:android="http://schemas.android.com/apk/res/android">    <alpha         android:fromAlpha="0.1"        android:toAlpha="1"        android:duration="5000"        />    <rotate         android:fromDegrees="0"        android:toDegrees="360"        android:pivotX="50%"        android:pivotY="50%"        android:duration="5000"        />    <scale         android:fromXScale="0.2"        android:toXScale="2"        android:fromYScale="0.2"        android:toYScale="2"        android:pivotX="50%"        android:duration="5000"        android:pivotY="50%"        />    <translate        android:fromXDelta="0"        android:toXDelta="0"        android:duration="5000"        android:fromYDelta="-100"        android:toYDelta="100"         /></set>

这样java代码里就不用创建AnimationSet了,看我代码

import android.os.Bundle;import android.view.animation.Animation;import android.view.animation.AnimationUtils;import android.widget.ImageView;import android.app.Activity;public class MainActivity extends Activity {private ImageView iv;private Animation setAnim;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initView();initAnim();setAnim();}private void setAnim() {iv.startAnimation(setAnim);}private void initAnim() {// 找动画setAnim = AnimationUtils.loadAnimation(MainActivity.this,R.anim.set_anim);}private void initView() {// 找idiv = (ImageView) findViewById(R.id.iv);}}
这样看更简单了,我想这就是为什么android建议我们使用xml控制动画的原因了










2 0