Android开发之使用Tween动画

Tween大概有四种动画效果：

1.Alpha：渐变透明度效果

2.Scale：伸缩效果

3.Translate：位置移动效果

4.Rotate：旋转效果

效果如图：

一、代码实现

   1.AlphaAnimation动画

      

// AlphaAnimation(float fromAlpha, float toAlpha)                //fromAlpha起始透明度，toAlpha结束时透明度                animation = new AlphaAnimation(0.1f, 1.0f);

    2.TranslateAnimation动画

  

//TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta)                //fromXDelta起始X位置，toXDelta 结束X位置                //fromYDelta起始Y位置,toYDelta 结束Y位置                //这里提到的位置均为相对位置，相对于img的原始位置                animation = new TranslateAnimation(100f, 0f, 0f, 0f);

   3.RotateAnimation动画

//RotateAnimation(float fromDegrees, float toDegrees, int pivotXType,                //             float pivotXValue, int pivotYType, float pivotYValue)                //fromDegrees起始角度，toDegrees结束角度                //pivotXType、pivotYType旋转模式                //pivotXValue、pivotYValue 旋转的中心（0.5f为图片的中心）                animation = new RotateAnimation(0f, 360f,                        Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);

   4.ScaleAnimation动画

    //ScaleAnimation(float fromX, float toX, float fromY, float toY,                //          int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)                //fromX 起始X坐标伸缩尺寸，toX结束时X坐标伸缩尺寸                //fromY 起始Y坐标伸缩尺寸，toY结束时Y坐标伸缩尺寸                //pivotXType，pivotYType伸缩模式                //pivotXValue，pivotYValue 伸缩动画的起始位置                //fromX，toX，fromY，toY，pivotXValue，pivotYValue这些参数表示百分比                animation = new ScaleAnimation(0f, 1f, 0f, 1f,                        Animation.RELATIVE_TO_SELF,1.0f,Animation.RELATIVE_TO_SELF,0.0f);

动画使用

       设置动画时间2秒

animation.setDuration(2000);

      添加到组件

ImageView img =  new ImageView(MainActivity.this);            img.setImageResource(R.drawable.incon);            img.startAnimation(animation);

当有多个动画执行时，怎么办？

使用AnimationSet类来装载多个动画。

效果如下

实现代码如下：

ImageView img_set = (ImageView) this.findViewById(R.id.img_set);        //动画一        Animation animation = new RotateAnimation(0f, 360f, Animation.RELATIVE_TO_SELF, 0.5f,                Animation.RELATIVE_TO_SELF, 0.5f);        //动画二        Animation animation1 = new TranslateAnimation(100f, 0f, 0f, 0f);        //设置动画时间        animation.setDuration(2000);        animation1.setDuration(2000);        //装入AnimationSet        AnimationSet animationSet = new AnimationSet(true);        animationSet.addAnimation(animation);        animationSet.addAnimation(animation1);        //装载到指定的组件        img_set.startAnimation(animationSet);

动画使用插值器(Interpolator)
插值器定义了动画变化的速率，提供不同的函数定义变化值相对于时间的变化规则.

在网上找了个表，参照一下

AccelerateDecelerateInterpolator先加速再减速AccelerateInterpolator加速AnticipateInterpolator先回退一小步然后加速前进AnticipateOvershootInterpolator先回退一小步然后加速前进,超出终点一小步再回到终点BounceInterpolator最后阶段弹球效果CycleInterpolator周期运动DecelerateInterpolator减速LinearInterpolator匀速OvershootInterpolator快速到达终点并超出一小步最后回到终点

示例效果演示，各个效果请自行测试。

示例实现代码：

 ImageView imageView = (ImageView) this.findViewById(R.id.img_interpolator);        Animation animation = new RotateAnimation(0f, 360f, Animation.RELATIVE_TO_SELF, 0.5f,                Animation.RELATIVE_TO_SELF, 0.5f);        animation.setDuration(2000);        //设置插值器        animation.setInterpolator(new BounceInterpolator());        imageView.startAnimation(animation);

二、xml实现

************************************************

    android:pivotX="50%" 与  android:pivotX="50%p"

前者对于自身，后者对于父控件

*************************************************

    1.AlphaAnimation动画

<?xml version="1.0" encoding="utf-8"?><alpha xmlns:android="http://schemas.android.com/apk/res/android"    android:fromAlpha="0.1"    android:toAlpha="1.0"    android:duration = "2000"></alpha>

    2.TranslateAnimation动画

<?xml version="1.0" encoding="utf-8"?><translate xmlns:android="http://schemas.android.com/apk/res/android"    android:duration="2000"    android:fromXDelta="100"    android:fromYDelta="0"    android:toXDelta="0"    android:toYDelta="0"></translate>

   3.RotateAnimation动画

<?xml version="1.0" encoding="utf-8"?><rotate xmlns:android="http://schemas.android.com/apk/res/android"    android:duration="2000"    android:fromDegrees="0"    android:pivotX="50%"    android:pivotY="50%"    android:toDegrees="+360"><!--android:toDegrees="+360" +为顺时针转，-为逆时针转--></rotate>

   4.ScaleAnimation动画

<scale xmlns:android="http://schemas.android.com/apk/res/android"    android:fromXScale="0.0"    android:toXScale="1.0"    android:fromYScale="0.0"    android:toYScale="1.0"    android:pivotY="50%"    android:pivotX="50%"    android:duration="2000"></scale>

这四个xml的，与上面代码的，效果是一样的。

xml配置动画的使用

animation = AnimationUtils.loadAnimation(getBaseContext(), R.anim.rotate);img.startAnimation(animation);

动画集合的使用(与上面的对应位置的动画效果一样)，用法与上面一样。

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"    android:duration="2000">    <rotate        android:fromDegrees="0"        android:toDegrees="360"        android:pivotY="50%"        android:pivotX="50%">    </rotate>    <translate        android:fromXDelta="100"        android:toXDelta="0"        android:fromYDelta="0"        android:toYDelta="0">    </translate></set>

xml文件中使用插值器（动画效果同上）。

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"    android:interpolator = "@android:anim/bounce_interpolator"    android:shareInterpolator="true"    android:duration="2000">    <rotate        android:fromDegrees="0"        android:toDegrees="360"        android:pivotX="50%"        android:pivotY="50%">    </rotate></set>

或者

<?xml version="1.0" encoding="utf-8"?><rotate xmlns:android="http://schemas.android.com/apk/res/android"    android:duration="2000"    android:fromDegrees="0"    android:interpolator="@android:anim/bounce_interpolator"    android:pivotX="50%"    android:pivotY="50%"    android:shareInterpolator="true"    android:toDegrees="360"></rotate>

demo下载：AnimationDemo