Android中LayoutAnimation的分析(一)

PS:本文系转载文章,阅读原文可读性会更好,文章末尾有原文链接
ps:源码是基于 android api 27 来分析的
LayoutAnimation 是用于对布局或 ViewGroup 的子 View 进行动画处理,每个子 View 的动画在不同的时间进行开始,但是使用的都是相同的动画。只要使用 LayoutAnimation 进行布局动画,那么它的实现要依赖布局动画控制器来完成;布局动画控制器是用来干什么的呢?它是用于计算每个子项的动画开始执行的偏移时间。
LayoutAnimation 控制器有2种,一种是 LayoutAnimationController,另外一种是 GridLayoutAnimationController,其实 GridLayoutAnimationController 是继承于 LayoutAnimationController,功能都差不多,只是比 LayoutAnimationController 多了几个功能参数;现在我们先写 demo 看一下效果,然后再分析一下相关的源码;
1、LayoutAnimationController demo
1、1 xml 的方式进行动画
【Android中LayoutAnimation的分析(一)】(1)在 app 目录下的 build.gradle 文件添加 RecyclerView 的依赖:
implementation "com.android.support:recyclerview-v7:26+"
(2)新建一个 Activity,名叫 LayoutAnimationControllerActivity :
public class LayoutAnimationControllerActivity extends AppCompatActivity {

RecyclerView mRv; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_layout_animation_controller); mRv = findViewById(R.id.rv); LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this); linearLayoutManager.setOrientation(LinearLayoutManager.VERTICAL); mRv.setLayoutManager(linearLayoutManager); mRv.setAdapter(new LayoutAnimationControllerAdapter(this)); }

}
(3)LayoutAnimationControllerActivity 对应的布局文件 activity_layout_animation_controller.xml :

xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/rv" android:layout_width="match_parent" android:layout_height="match_parent" android:layoutAnimation="@anim/layout_animation_fall_down" tools:context=".LayoutAnimationControllerActivity">


(4)在 res 目录下新建一个 anim 文件夹,在 anim 目录下新建一个 layoutAnimation 对应的 xml 文件 layout_animation_fall_down.xml :
layout_animation_fall_down.xml
android:animation="@anim/item_animation_drop_down" android:animationOrder="normal" android:delay="85%" />

(5)在 anim 文件夹下面新建一个 animation 对应的 xml 文件 item_animation_drop_down.xml :
item_animation_drop_down.xml
android:duration="800" android:shareInterpolator="@android:anim/decelerate_interpolator">


(6)RecyclerView 对应的 Adapter 实现类 LayoutAnimationControllerAdapter :
public class LayoutAnimationControllerAdapter extends RecyclerView.Adapter {
private Context mContext; public LayoutAnimationControllerAdapter(Context context) { mContext = context; }@NonNull @Override public LayoutAnimationControllerAdapter.LinearViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) { View item = LayoutInflater.from(mContext).inflate(R.layout.item_1, parent, false); return new LinearViewHolder(item); }@Override public void onBindViewHolder(@NonNull LayoutAnimationControllerAdapter.LinearViewHolder holder, final int position) { holder.mTv.setText("第" + (position+1) + "个条目"); }@Override public int getItemCount() { return 100; }class LinearViewHolder extends RecyclerView.ViewHolder { TextView mTv; public LinearViewHolder(View itemView) { super(itemView); mTv = itemView.findViewById(R.id.tv); } }

}
(7)LayoutAnimationControllerAdapter 对应的 item 布局文件 item_1.xml :

xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/tv" android:layout_marginTop="10px" android:text="你好" android:layout_width="match_parent" android:background="#00FF00" android:layout_height="50px">


程序运行后,效果如下所示:
1、2 Java 的方式进行动画
(1)我们在 xml 的方式进行动画的基础上进行修改,新建一个 Activity,名叫 LayoutAnimationController2Activity :
public class LayoutAnimationController2Activity extends AppCompatActivity {
RecyclerView mRv; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_layout_animation_controller2); mRv = findViewById(R.id.rv); final Animation animation = AnimationUtils.loadAnimation(this, R.anim.item_animation_drop_down); LayoutAnimationController layoutAnimation = new LayoutAnimationController(animation); layoutAnimation.setDelay(0.85f); layoutAnimation.setOrder(LayoutAnimationController.ORDER_NORMAL); mRv.setLayoutAnimation(layoutAnimation); LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this); linearLayoutManager.setOrientation(LinearLayoutManager.VERTICAL); mRv.setLayoutManager(linearLayoutManager); mRv.setAdapter(new LayoutAnimationControllerAdapter(this)); }

}
(2)LayoutAnimationController2Activity 对应的布局文件 activity_layout_animation_controller2.xml(注意:RecyclerView 中没有添加 layoutAnimation 属性) :

xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/rv" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".LayoutAnimationController2Activity">


程序我就不再运行了,它的效果是跟 1、1 xml 的方式进行动画的效果是一样的;Java 的方式进行动画,通过 AnimationUtils 加载 animation 对应的 xml 文件;通过用 LayoutAnimationController 的 setDelay 和 setOrder 方法实现 layoutAnimation 对应 xml 文件中的 delay 和 animationOrder 属性。
2、2 GridLayoutAnimationController demo
2、1 xml 的方式进行动画
(1)新建一个 Activity,名叫 GridLayoutAnimationActivity :
public class GridLayoutAnimationActivity extends AppCompatActivity {
GridView mGv; GridAdapter mGrideAdapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_grid_layout_animation); mGv = findViewById(R.id.gv); List list = new ArrayList(); for (int i = 0; i < 100; i++) { list.add("item--"+i); } mGrideAdapter = new GridAdapter(this,list); mGv.setAdapter(mGrideAdapter); }

}
(2) GridLayoutAnimationActivity 对应的布局文件 activity_grid_layout_animation.xml :

xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/gv" android:layout_width="match_parent" android:layout_height="100dp" android:numColumns="4" android:horizontalSpacing="10dp" android:verticalSpacing="10dp" android:layoutAnimation="@anim/layout_animation_grid" tools:context=".GridLayoutAnimationActivity">


(3)在 anim 目录下新建一个 layoutAnimation 对应的 xml 文件 layout_animation_grid.xml :
layout_animation_grid.xml
android:rowDelay="0%" android:columnDelay="60%" android:directionPriority="column" android:animation="@anim/slide_in_left"/>

(4)在 anim 文件夹下面新建一个 animation 对应的 xml 文件 slide_in_left.xml :
slide_in_left.xml




(5)GridView 对应的 Adapter 实现类 GridAdapter :
public class GridAdapter extends BaseAdapter {
private Context mContext; private List mList; public GridAdapter(Context context,List list) { mContext = context; mList = list; } public View getView(int position, View convertView, ViewGroup parent) { View item = LayoutInflater.from(mContext).inflate(R.layout.item_grid,parent,false); return item; }public final int getCount() { return mList == null ? 0 : mList.size(); }public final Object getItem(int position) { return null; }public final long getItemId(int position) { return position; }

}
(6)GridAdapter 对应的 item 布局文件 item_grid.xml

xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:text="hellow" android:layout_height="wrap_content">


程序运行后,效果如下所示:
2、2 Java 的方式进行动画
(1)我们在 xml 的方式进行动画的基础上进行修改,新建一个 Activity,名叫 GridLayoutAnimation2Activity :
public class GridLayoutAnimation2Activity extends AppCompatActivity {
GridView mGv; GridAdapter mGrideAdapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_grid_layout_animation2); mGv = findViewById(R.id.gv); List list = new ArrayList(); for (int i = 0; i < 100; i++) { list.add("item--"+i); } final Animation animation = AnimationUtils.loadAnimation(this, R.anim.slide_in_left); GridLayoutAnimationController layoutAnimation = new GridLayoutAnimationController(animation); layoutAnimation.setDirectionPriority(GridLayoutAnimationController.PRIORITY_COLUMN); layoutAnimation.setColumnDelay(0.6f); layoutAnimation.setRowDelay(0f); mGv.setLayoutAnimation(layoutAnimation); mGrideAdapter = new GridAdapter(this,list); mGv.setAdapter(mGrideAdapter); }

}
(2) GridLayoutAnimation2Activity 对应的布局文件 activity_grid_layout_animation2.xml(注意:这里的 GridView 也没有添加 layoutAnimation 属性) :

xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/gv" android:layout_width="match_parent" android:layout_height="100dp" android:numColumns="4" android:horizontalSpacing="10dp" android:verticalSpacing="10dp" tools:context=".GridLayoutAnimation2Activity">


程序我就不再运行了,它跟 2、1 xml 的方式进行动画的效果是一样的;Java 的方式进行动画,通过 AnimationUtils 加载 animation 对应的 xml 文件;通过用 GridLayoutAnimationController 的 setDirectionPriority、setColumnDelay 和 setRowDelay 方法实现 layoutAnimation 对应 xml 文件中的 directionPriority、columnDelay 和 rowDelay 属性。
我们对 LayoutAnimationController demo(xml 的方式进行动画) 中layout_animation_fall_down.xml 文件的 layoutAnimation 标签中的属性进行说明:
(1)animation :定义布局或视图组中每一项要执行的动画文件。
(2)delay :设置动画的延迟,0%表示所有项目同时进行动画,100%表示每个项目完成其动画后再开始下一个项目,15%表示项目动画达到15%时开始下一一个项目的动画。
(3)animationOrder :控制子项目动画的顺序,默认有三种类型,normal 表示根据布局的自然顺序,如果是垂直方向,则会从上到下进行动画,如果是水平方向,则从左到右进行动画;reverse 和 normal 是反着来的;random表示随机出现子项目动画。
我们再对 GridLayoutAnimationController demo(xml 的方式进行动画) 中 layout_animation_grid.xml 文件的 gridLayoutAnimation 标签中的属性进行说明并拓展一个 direction 属性:
(1)rowDelay :每一行动画开始的延迟。
(2)columnDelay :每一列动画开始的延迟。
(3)directionPriority :方向优先级,row 表示行优先,column 表示列优先,none 表示同时进行;例如,列优先,则一列一列的执行动画,第一列执行完成后再执行第二列,其他的同样这样推理。
这篇文章写到这里先告一段落了,但是还没完,下一篇会继续分析它们的源码。
图片
关注微信公众号,阅读更多文章

    推荐阅读