Android 补间动画(Tween)之二,自定义补间动画

Android提供了Animation做为补间动画抽象基类,而且为该抽象基类提供了AlphaAnimation,RotateAnimation,ScaleAnimation,TranslateAnimation四个实现类,这四个实现类只是补间动画的四种基本形式:透明度改变,旋转,缩放,位移,在实际项目中可能还需要一些更复杂的动画,比如让图片在"三维"空间内进行旋转动画等,这就需要我们自己开发补间动画了.

自定义补间动画并不难,需要继承Animation,继承Animation时关键是要重写该抽象基类的applyTransformation(float interpolatedTime, Transformation t)方法,该方法中两个参数的说明如下.

> interpolatedTime: 代表了动画的时间进行比.不管动画实际的持续时间如何,当动画播放时,该参数总是自动从0变化到1的.

> Transformation: 该参数代表了补间动画在不同时刻对图形或组件的变形程度.

从上面的介绍可以看出,实现自定义动画的关键就在于重写applyTransformation方法时根据interpolatedTime时间来动态的计算动画对图片或视图的变形程度.

Transformation代表了对图片或视图的变形,该对象里封装了一个Matrix对象,对它所包装了Matrix进行位移,倾斜,选装等变换时,Transformation将会控制对应的图片或视图进行相应的变换.

为了控制图片或View进行三维空间的变换,还需要借助于Android提供的一个Camera,这个Camera并非代表手机的摄像头,只是一个空间变换工具,作用有点类似于Matrix,但功能更强大.

Camera提供了如下常用的方法.

> getMatrix(Matrix matrix): 将Camera所做的变换应用到指定matrix上.

> rotateX(float deg): 将目标组件沿X轴旋转.

> rotateY(float deg): 将目标组件沿Y轴旋转.

> rotateZ(float deg): 将目标组件沿Z轴旋转.

> translate(float x, float y, flaot z): 把目标组件在三维空间里进行位移变换.

> applyRoCanvas(Canvas canvas):把Camera所做的变换应用到Canvas上.

从上面的方法可以看出,Camera的主要用于指出三维空间的变换,那么手机中三维空间的坐标系统是怎样的?下图显示了手机屏幕上的三维坐标系统.



当Camera控制图片或View沿着X,Y,Z轴旋转时,被旋转的图片或View将会呈现出三位透视的效果.下图:



下面的程序将会利用Camera来自定义在三维空间的动画.

1.自定义动画类

package com.example.animationdemo.view;

import android.graphics.Camera;
import android.graphics.Matrix;
import android.view.animation.Animation;
import android.view.animation.LinearInterpolator;
import android.view.animation.Transformation;

public class MyAnimation extends Animation {
private int centerX;
private int centerY;
/** 定义动画的持续时间 */
private int duration;
private Camera camera = new Camera();

public MyAnimation(int x, int y, int duration) {
super();
this.centerX = x;
this.centerY = y;
this.duration = duration;
}

@Override
public void initialize(int width, int height, int parentWidth,
int parentHeight) {
super.initialize(width, height, parentWidth, parentHeight);
// 设置动画的持续时间
setDuration(duration);
// 设置动画结束后效果保留
setFillAfter(true);

// 指定动画匀速改变
setInterpolator(new LinearInterpolator());
}

/***
* 该方法的interpolatedTime代表了抽象的动画持续时间,不管动画的持续时间多长
* interpolatedTime参数总是从0(动画开始时)~1(动画结束时) Transformation参数代表了对目标组件所做的改变
*/
@Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
super.applyTransformation(interpolatedTime, t);
// 保存camera的状态,每次结束时应该调用restore()方法保持平衡
camera.save();
// 根据interpolatedTime时间来控制X,Y,Z上的偏移
camera.translate(100.0f - 100.0f * interpolatedTime,
150.0f * interpolatedTime - 150.0f,
80.0f - 80.0f * interpolatedTime);
//根据设置的interpolatedTime时间在X轴上旋转不同的角度
camera.rotateX(360 * interpolatedTime);
//根据设置的interpolatedTime时间在Y轴上旋转不同的角度
camera.rotateY(360 * interpolatedTime);
//根据Transformation参数获得Matrix对象
Matrix matrix = t.getMatrix();
//计算对应于与所提供的矩阵对象的当前变换矩阵并将其复制
camera.getMatrix(matrix);
matrix.preTranslate(-centerX, -centerY);
matrix.postTranslate(centerX, centerY);

// 恢复保存的状态,如果有
camera.restore();

}

}

2.activity类

package com.example.animationdemo;

import android.app.Activity;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.view.Display;
import android.view.WindowManager;
import android.widget.ArrayAdapter;
import android.widget.ListView;

import com.example.animationdemo.view.MyAnimation;

public class ListViewTweenActivity extends Activity {
private ListView mListView;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_listview_tween);
mListView = (ListView) findViewById(R.id.tween_listview);
WindowManager manager = (WindowManager) getSystemService(WINDOW_SERVICE);
Display display = manager.getDefaultDisplay();
DisplayMetrics displayMetrics = new DisplayMetrics();
//获取屏幕的宽和高
display.getMetrics(displayMetrics);
//设置对ListView组件应用动画
mListView.setAnimation(new MyAnimation((int)displayMetrics.xdpi / 2, (int)displayMetrics.ydpi / 2, 3500));
ArrayAdapter<String> adapter = new ArrayAdapter<>(this, android.R.layout.simple_list_item_1, new String[]{"java编程思想","疯狂java讲义","疯狂Android讲义","疯狂html5讲义","疯狂C#讲义","各种讲义","Android高级应用开发","嘎嘎嘎嘎"});
mListView.setAdapter(adapter);
}

}

3.activity布局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ListView
android:id="@+id/tween_listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>

</LinearLayout>

运行这个程序,将会出现三维动画效果