Android中的动画

一、Android中动画分类

Android中的动画大致分为两类：Frame动画，View动画。

二、Frame动画

1、frame_list.xml 帧动画的具体实现，需要有帧动画使用的对应资源。

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="true">
<item
android:drawable="@drawable/a"
android:duration="1000" />   //单张图片设置时间相对较长，便于看清所有效果
<item
android:drawable="@drawable/b"
android:duration="2000" />
<item
android:drawable="@drawable/c"
android:duration="2000" />
<item
android:drawable="@drawable/d"
android:duration="2000" />
<item
android:drawable="@drawable/e"
android:duration="2000" />
<item
android:drawable="@drawable/f"
android:duration="2000" />

</animation-list>

2、帧动画实现的主体布局 activity_frame.xml

<?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">

<ImageView
android:id="@+id/frame_iv"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@anim/frame_list" />

</LinearLayout>

3、帧动画的具体实现

public class FrameActivity  extends Activity{
private ImageView frameIv;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_frame);

frameIv = (ImageView) findViewById(R.id.frame_iv);
AnimationDrawable ad = (AnimationDrawable) frameIv.getBackground();
ad.start();
}
}

三、View动画

View动画有两种实现模式，xml布局文件或者java代码实现。

1、xml布局实现

alpha_anim.xml 渐变动画

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fillBefore="true"
android:fillEnabled="true"
android:fromAlpha="1.0"
android:interpolator="@android:anim/cycle_interpolator"
android:repeatCount="infinite"
android:repeatMode="reverse"
android:toAlpha="0.2">
<!--渐变动画-->
<!--fillBefore 动画结束时留在第一帧   fillEnabled 配合使用  android:repeatCount="infinite" 无限次循环-->
</alpha>

rotate_anim.xml 旋转动画

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromDegrees="0"
android:toDegrees="360">
</rotate>

scale_anim.xml 缩放动画

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromXScale="50%"
android:fromYScale="300%"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:pivotX="20%"
android:pivotY="80%"
android:repeatCount="2"
android:repeatMode="restart"
android:startOffset="1000"
android:toXScale="150%"
android:toYScale="50%">
<!--缩放动画-->
<!--interpolator 变速器，动画执行的速率变化   pivotX x轴缩放中心   startOffset 触发事件后延迟毫秒 -->
<!--repeatMode 重复方式：重头开始-->
</scale>

trans_anim.xml 平移动画

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fillAfter="true"
android:fromXDelta="0"
android:fromYDelta="200"
android:repeatCount="3"
android:repeatMode="reverse"
android:toXDelta="100"
android:toYDelta="0">
<!--平移动画-->
<!--duration 动画执行时长 fillAfter 保持最后一帧效果 repeatCount 重复次数 repeatMode 重复方式   -->
<!--fromXDelta x轴开始位置 toXDelta x轴到达位置 fromYDelta y轴开始位置 toYDelta y轴到达位置     -->
</translate>

set_anim.xml 动画合集

<?xml version="1.0" encoding="utf-8"?> <strong><span style="color:#ff0000;"> //不能使用include包含</span></strong>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:repeatCount="infinite"
android:repeatMode="restart">
<translate
android:duration="400"
android:fromXDelta="500"
android:toXDelta="100" />

<alpha
android:duration="300"
android:fromAlpha="1.0"
android:toAlpha="0" />

<scale
android:duration="300"
android:fromYScale="2.0"
android:toYScale="0.5" />

</set>

MainActivity实现

public class MainActivity extends ActionBarActivity implements View.OnClickListener {
/**
* 触发事件触发点
*/
private Button transAnimBt;
private Button scaleAnimBt;
private Button alphaAnimBt;
private Button setAnimBt;
private Button rotateAnimBt;
private Button changeActivityBt;

/**
* 执行动画
*/
private TranslateAnimation ta;
private ScaleAnimation sa;
private AlphaAnimation aa;
private AnimationSet as;
private RotateAnimation ra;

private ImageView ivSource;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

initView();

initData();
}

/**
* 初始化布局
*/
private void initView() {
transAnimBt = (Button) findViewById(R.id.bt_animation_trans);
scaleAnimBt = (Button) findViewById(R.id.bt_animation_scale);
alphaAnimBt = (Button) findViewById(R.id.bt_animation_alpha);
rotateAnimBt = (Button) findViewById(R.id.bt_animation_rotate);
setAnimBt = (Button) findViewById(R.id.bt_animation_set);
changeActivityBt = (Button) findViewById(R.id.bt_animation_change);

ivSource = (ImageView) findViewById(R.id.iv_animation);

initSetOnClickListener();
}

/**
* 初始化数据
*/
private void initData() {

ta = (TranslateAnimation) AnimationUtils.loadAnimation(this, R.anim.trans_anim);
sa = (ScaleAnimation) AnimationUtils.loadAnimation(this, R.anim.scale_anim);
aa = (AlphaAnimation) AnimationUtils.loadAnimation(this, R.anim.alpha_anim);
as = (AnimationSet) AnimationUtils.loadAnimation(this, R.anim.set_anim);
ra = (RotateAnimation) AnimationUtils.loadAnimation(this, R.anim.rotate_anim);

ivSource.setBackgroundResource(R.drawable.a);
}

/**
* 初始化点击监听事件
*/
private void initSetOnClickListener() {
transAnimBt.setOnClickListener(this);
scaleAnimBt.setOnClickListener(this);
alphaAnimBt.setOnClickListener(this);
rotateAnimBt.setOnClickListener(this);
setAnimBt.setOnClickListener(this);
changeActivityBt.setOnClickListener(this);
}

@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.bt_animation_alpha:
ivSource.startAnimation(aa);
break;
case R.id.bt_animation_trans:
ivSource.startAnimation(ta);
break;
case R.id.bt_animation_scale:
ivSource.startAnimation(sa);
break;
case R.id.bt_animation_set:
ivSource.startAnimation(as);
break;
case R.id.bt_animation_rotate:
ivSource.startAnimation(ra);
break;
case R.id.bt_animation_change:
startActivity(new Intent(MainActivity.this, JavaAnimation.class));
break;
}
}
}

主体布局 activity_main.xml

<RelativeLayout 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"
tools:context=".MainActivity">

<LinearLayout
android:id="@+id/animation_bt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">

<Button
android:id="@+id/bt_animation_trans"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="平移动画" />

<Button
android:id="@+id/bt_animation_rotate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="旋转动画" />

<Button
android:id="@+id/bt_animation_scale"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="缩放动画" />

<Button
android:id="@+id/bt_animation_alpha"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="渐变动画" />

</LinearLayout>

<LinearLayout
android:id="@+id/bt_booss"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/animation_bt"
android:gravity="center_horizontal">

<Button
android:id="@+id/bt_animation_set"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="动画合集" />

<Button
android:id="@+id/bt_animation_change"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="跳转页面" />

</LinearLayout>

<ImageView
android:id="@+id/iv_animation"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="@+id/bt_booss" />
</RelativeLayout>

也可只适用代码的形式实现对应动画，主布局依旧使用activity_main.xml，类的具体实现：

public class JavaAnimation extends Activity implements View.OnClickListener {
/**
* 触发事件触发点
*/
private Button transAnimBt;
private Button scaleAnimBt;
private Button alphaAnimBt;
private Button setAnimBt;
private Button rotateAnimBt;
private Button changeActivityBt;
private ImageView ivSource;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

initView();
}

/**
* 初始化布局
*/
private void initView() {
transAnimBt = (Button) findViewById(R.id.bt_animation_trans);
scaleAnimBt = (Button) findViewById(R.id.bt_animation_scale);
alphaAnimBt = (Button) findViewById(R.id.bt_animation_alpha);
rotateAnimBt = (Button) findViewById(R.id.bt_animation_rotate);
setAnimBt = (Button) findViewById(R.id.bt_animation_set);
changeActivityBt = (Button) findViewById(R.id.bt_animation_change);

ivSource = (ImageView) findViewById(R.id.iv_animation);
ivSource.setBackgroundResource(R.drawable.e);

initSetOnClickListener();
}

/**
* 初始化点击监听事件
*/
private void initSetOnClickListener() {
transAnimBt.setOnClickListener(this);
scaleAnimBt.setOnClickListener(this);
alphaAnimBt.setOnClickListener(this);
rotateAnimBt.setOnClickListener(this);
setAnimBt.setOnClickListener(this);
changeActivityBt.setOnClickListener(this);
}

@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.bt_animation_alpha://渐变动画
AlphaAnimation aa = new AlphaAnimation(0.5f, 2.0f);
aa.setDuration(500);
aa.setRepeatMode(Animation.RESTART);
aa.setFillAfter(true);
ivSource.startAnimation(aa);
break;
case R.id.bt_animation_trans://平移动画
TranslateAnimation ta = new TranslateAnimation(Animation.ABSOLUTE, 100, Animation.RELATIVE_TO_SELF, 1.5f);
ta.setDuration(500);
ta.setRepeatCount(2);
ta.setRepeatMode(Animation.INFINITE);
ivSource.startAnimation(ta);
break;
case R.id.bt_animation_scale:
ScaleAnimation sa = new ScaleAnimation(2.0f, 0.3f, 4.0f, 0.5f);
sa.setDuration(500);
sa.setFillBefore(true);
ivSource.startAnimation(sa);
break;
case R.id.bt_animation_set:
AnimationSet as = new AnimationSet(true);

ScaleAnimation saTemp = new ScaleAnimation(0.2f, 1.0f, 3.0f, 1.0f);
as.addAnimation(saTemp);

AlphaAnimation aaTemp = new AlphaAnimation(1.0f, 0.3f);
as.addAnimation(aaTemp);
ivSource.startAnimation(as);
break;
case R.id.bt_animation_rotate:
RotateAnimation ra = new RotateAnimation(0, 360);
ra.setDuration(1000);
ivSource.startAnimation(ra);
break;
case R.id.bt_animation_change:
startActivity(new Intent(JavaAnimation.this, FrameActivity.class));
break;
}
}
}

Demo下载链接