【Layout Animation 布局动画】

  1、  本文要完成的任务：

在类似ListView这种包含子view的控件上实现item动画效果

  2、 效果展示图如下：






[b] 
3、 [b]任务具体实现：[/b]
[/b]

[b]1--->准备5种不同的动画xml文件[/b]



[b]渐现动画文件layout_alpha.xml内容：[/b]

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

<!-- duration 动画持续时间
fromAlpha 开始透明度值
toAlpha 结束透明度值
0表示完全透明 1表示完全不透明-->
</alpha>


放大动画文件layout_scale.xml内容：
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromXScale="0.0"
android:fromYScale="0.0"
android:pivotX="1%"
android:pivotY="1%"
android:toXScale="1.0"
android:toYScale="1.0" >

<!--
duration 动画持续时间
fromXScale x方向上开始时候的大小
fromYScale y方向上开始时候的大小
pivotX x方向上缩放的中心位置
pivotY y方向上缩放的中心位置
toXScale x方向上结束时候的大小
toYScale y方向上结束时候的大小
-->

</scale>

左边飞入动画layout _left_in_translate.xml内容：
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

<translate
android:duration="500"
android:fromXDelta="-300"
android:fromYDelta="0"
android:toXDelta="0"
android:toYDelta="0" >
</translate>

<alpha
android:duration="500"
android:fromAlpha="0.0"
android:toAlpha="1.0" >
</alpha>

</set>


[b]右边飞入动画文件layout_right_in_translate.xml内容：[/b]
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

<translate
android:duration="500"
android:fromXDelta="300"
android:fromYDelta="0"
android:toXDelta="0"
android:toYDelta="0" >
</translate>

<alpha
android:duration="500"
android:fromAlpha="0.0"
android:toAlpha="1.0" >
</alpha>

</set>
[b]底部飞入动画文件layout_bottom_in_translate.xml内容：[/b]
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

<translate
android:duration="500"
android:fromXDelta="0"
android:fromYDelta="100"
android:toXDelta="0"
android:toYDelta="0" >
</translate>

<alpha
android:duration="500"
android:fromAlpha="0.0"
android:toAlpha="1.0" >
</alpha>

</set>


2--->在java中获取ListView对象，并且向ListView中填充一些数据：
listView = (ListView) findViewById(R.id.listView1);
//设置listview的分隔部分为null
listView.setDivider(null);

/**
* 1.准备数据集合 2.准备适配器 3.视图加载适配器
*/
// 新建数据集合
ArrayList<String> data = new ArrayList<String>();
for (int i = 1; i <= 20; i++) {
String s = "######第" + i + "行######";
data.add(s);
}
// 新建适配器
adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_list_item_1, android.R.id.text1, data);

// 视图加载适配器
listView.setAdapter(adapter);

[b]3--->构造布局动画并让ListView加载和播放：[/b]
//播放布局动画
private void playLayoutAnimation(int animId){
// 新建布局动画控制器
LayoutAnimationController lac = new LayoutAnimationController(
AnimationUtils.loadAnimation(this, animId));
//设置动画顺序
lac.setOrder(LayoutAnimationController.ORDER_NORMAL);
//视图加载动画控制器
listView.setLayoutAnimation(lac);
//开始播放动画
listView.startLayoutAnimation();
}


4--->点击不同的按钮就可以播放不同的布局动画了：
switch (v.getId()) {
case R.id.button1:
//放大出现
playLayoutAnimation(R.anim.layout_scale);
break;
case R.id.button2:
//左边飞入
playLayoutAnimation(R.anim.layout_left_in_translate);
break;
case R.id.button3:
//右边飞入
playLayoutAnimation(R.anim.layout_right_in_translate);
break;
case R.id.button4:
//底部飞入
playLayoutAnimation(R.anim.layout_bottom_in_translate);
break;

default:
break;
}


03_Layout Animation 布局动画Demo下载