Android LayoutAnimation使用

一.概述

今天来看看LayoutAnimation的使用，先看效果图

二.实现

新建一个动画文件

<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
android:delay="30%"
android:animationOrder="random"
android:animation="@anim/slide_right"
/>

<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator">
<translate android:fromXDelta="100%p"
android:toXDelta="0"
android:duration="900"
/>
</set>

然后我们在布局文件的listview中使用

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
>
<ListView
android:id="@+id/listview"
android:layout_width="match_parent"
android:layoutAnimation="@anim/list_anim_layout"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
android:scrollbars="none"
>
</ListView>
</LinearLayout>

最后给出Java代码

public class MainActivity extends Activity {

private ListView listView;
private List data = new ArrayList();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listView = (ListView) findViewById(R.id.listview);
for (int i = 0;i<20;i++){
data.add("杨幂"+i);
}
listView.setAdapter(new MyAdapter(this,R.layout.item1,R.id.text,data));
}
class MyAdapter extends ArrayAdapter<String>{
public MyAdapter(Context context, int resource, int textViewResourceId, List<String> objects) {
super(context, resource, textViewResourceId, objects);
}
}
}

效果二

我们给GridView添加了一个LayoutAnimation，我们看看如何实现

布局文件

<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="com.example.hecun.myapplication.MainActivity">
<GridView
android:id="@+id/gd"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:numColumns="4"
android:animateLayoutChanges="true"
android:verticalSpacing="10dp"
/>
</RelativeLayout>

每个item布局文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
>
<TextView
android:id="@+id/tv_item"
android:layout_width="80dp"
android:layout_height="80dp"
android:background="@drawable/item_bg"
android:gravity="center"
android:textColor="@android:color/white"
android:textSize="20sp"
/>
</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>
<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
android:delay="0.5"
android:animationOrder="normal"
android:animation="@anim/itemanim"
>
</layoutAnimation>

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="true"
android:duration="400"
>
<alpha android:fromAlpha="0"
android:toAlpha="1"
/>
<scale android:pivotX="50%"
android:pivotY="50%"
android:fromXScale="0"
android:toXScale="1"
android:fromYScale="0"
android:toYScale="1"/>
</set>

代码

public class MainActivity extends AppCompatActivity {

private GridView gridView;
private List<String> datas;
private GridAdapter adapter;
private LayoutAnimationController controller;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
gridView = (GridView) findViewById(R.id.gd);
initData();
adapter = new GridAdapter(this,datas);
gridView.setAdapter(adapter);
controller = AnimationUtils.loadLayoutAnimation(this, R.anim.gridlayoutanim);
controller.setDelay(0.5f);
controller.setOrder(LayoutAnimationController.ORDER_NORMAL);
gridView.setLayoutAnimation(controller);
}
public void initData(){
datas = new ArrayList<>();
for(int i = 1;i<9;i++){
datas.add(String.valueOf(i));
}
}
}

扩展

我们知道，LayoutAnimation只有三种方式，顺序，逆序，随机，我们接下来看看如何进行扩展。

public class CustomLayoutController extends LayoutAnimationController {
public static final int CUSTOM_ORDER = 0;
private OnIndexListener onIndeListener;

public void setOnIndexListener(OnIndexListener listener){
onIndeListener = listener;
}

public CustomLayoutController(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomLayoutController(Animation animation) {
super(animation);
}

public CustomLayoutController(Animation animation, float delay) {
super(animation, delay);
}

/**
* 返回播放动画的顺序
* @param params
* @return
*/
@Override
protected int getTransformedIndex(AnimationParameters params) {
if(getOrder() == CUSTOM_ORDER&&onIndeListener!=null){
return onIndeListener.onIndex(this,params.count,params.index);
}else{
return super.getTransformedIndex(params);
}
}

public  interface OnIndexListener{
int onIndex(CustomLayoutController controller,int count,int index);
}
}

public class MainActivity extends AppCompatActivity implements CustomLayoutController.OnIndexListener{

private GridView gridView;
private List<String> datas;
private GridAdapter adapter;
private Animation animation;
private CustomLayoutController controller;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
gridView = (GridView) findViewById(R.id.gd);
initData();
adapter = new GridAdapter(this,datas);
gridView.setAdapter(adapter);
animation = AnimationUtils.loadAnimation(this, R.anim.itemanim);
controller = new CustomLayoutController(animation);
controller.setDelay(0.5f);
controller.setOrder(LayoutAnimationController.ORDER_NORMAL);
gridView.setLayoutAnimation(controller);
controller.setOnIndexListener(this);
}
public void initData(){
datas = new ArrayList<>();
for(int i = 1;i<9;i++){
datas.add(String.valueOf(i));
}
}
//count为item总数，此处为8，index从0-7
@Override
public int onIndex(CustomLayoutController controller, int count, int index) {
switch (index % 4){
//每一行，右边的比左边的慢，每一列，下面的比上面的慢
case 0:
return 0 + index / 4;
case 1:
return 1 + index / 4;
case 2:
return 2 + index / 4;
case 3:
return 3 + index / 4;
}
return index;
}
}

上面的动画效果中，因为gridview为4列，而每一行动画都比上一行延迟一点，但也不是上一行结束时才结束，所以对4整除。