第二十七讲：Android之Animation（二）

浏览数：34 / 时间：2015年06月11日

勿以恶小而为之，勿以善小而不为。惟贤惟德，能服于人。—— 刘备

本讲内容：Animation 动画

一、Interpolator 插值器 (定义动画变化的速率) 我们也可以自定义的插值器

Interpolator对象	资源ID	功能作用
AccelerateDecelerateInterpolator	@android:anim/accelerate_decelerate_interpolator	先加速再减速
AccelerateInterpolator	@android:anim/accelerate_interpolator	加速
AnticipateInterpolator	@android:anim/anticipate_interpolator	先回退一小步然后加速前进
AnticipateOvershootInterpolator	@android:anim/anticipate_overshoot_interpolator	在上一个基础上超出终点一小步再回到终点
BounceInterpolator	@android:anim/bounce_interpolator	最后阶段弹球效果
CycleInterpolator	@android:anim/cycle_interpolator	周期运动
DecelerateInterpolator	@android:anim/decelerate_interpolator	减速
LinearInterpolator	@android:anim/linear_interpolator	匀速
OvershootInterpolator	@android:anim/overshoot_interpolator	速到达终点并超出一小步最后回到终点

二、上一讲我们用编码实现动画效果，本讲将以XML形式定义动画

我们通过一个例子感受一下，代码的讲解都写在注释里了

下面是res/layout/activity_main.xml 布局文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.text.MainActivity$PlaceholderFragment" >
 <ImageView 
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:src="@drawable/c1"
        android:layout_weight="1"/>
   <Button 
       android:id="@+id/translate" 
       android:layout_width="match_parent"
	   android:layout_height="wrap_content"
	   android:text="测试translate动画效果" />
   <Button 
       android:id="@+id/alpha" 
       android:layout_width="match_parent"
	   android:layout_height="wrap_content"
	   android:text="测试alpha动画效果" />
   <Button 
       android:id="@+id/rotate" 
       android:layout_width="match_parent"
	   android:layout_height="wrap_content"
	   android:text="测试rotate动画效果" />
   <Button 
       android:id="@+id/scale" 
       android:layout_width="match_parent"
	   android:layout_height="wrap_content"
	   android:text="测试scale动画效果" />
    
</LinearLayout>

在res文件下新建一个文件名为anim

下面是新建res/anim/alpha.xml文件：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
	android:interpolator="@android:anim/accelerate_interpolator">
	<scale android:fromXScale="1.0" 
		android:toXScale="0.0"
		android:fromYScale="1.0" 
		android:toYScale="0.0" 
		android:pivotX="50%"
		android:pivotY="50%" 
		android:duration="2000" />
</set>

android:interpolator="@android:anim/accelerate_interpolator"   <span style="font-family: Arial; font-size: 14px; line-height: 26px;">定义一个加速插值器</span>

下面是新建res/anim/rotate.xml文件：

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

下面是新建res/anim/scale.xml文件：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
	android:interpolator="@android:anim/accelerate_interpolator">
	<scale android:fromXScale="1.0" 
		android:toXScale="0.0"
		android:fromYScale="1.0" 
		android:toYScale="0.0" 
		android:pivotX="50%"
		android:pivotY="50%" 
		android:duration="2000" />
</set>

下面是新建res/anim/translate.xml文件：

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

下面是MainActivity.java主界面文件：

public class MainActivity extends Activity implements OnClickListener {
	private Button translate;
	private Button alpha;
	private Button rotate;
	private Button scale;
	private ImageView image;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		image = (ImageView) findViewById(R.id.image);
		translate = (Button) findViewById(R.id.translate);
		alpha = (Button) findViewById(R.id.alpha);
		rotate = (Button) findViewById(R.id.rotate);
		scale = (Button) findViewById(R.id.scale);
		translate.setOnClickListener(this);
		alpha.setOnClickListener(this);
		rotate.setOnClickListener(this);
		scale.setOnClickListener(this);
	}

	@Override
	public void onClick(View v) {
		switch (v.getId()) {
		case R.id.translate:
			// 使用AnimationUtils装载动画设置文件
			Animation anim1 = (Animation) AnimationUtils.loadAnimation(MainActivity.this, R.anim.translate);
			image.startAnimation(anim1);
			break;
		case R.id.alpha:
			Animation anim2 = AnimationUtils.loadAnimation(MainActivity.this,R.anim.alpha);
			image.startAnimation(anim2);
			break;
		case R.id.rotate:
			Animation anim3 = AnimationUtils.loadAnimation(MainActivity.this,R.anim.rotate);
			image.startAnimation(anim3);
			break;
		case R.id.scale:
			Animation anim4 = AnimationUtils.loadAnimation(MainActivity.this,R.anim.scale);
			image.startAnimation(anim4);
			break;
		}
	}
}

下面是运行结果：