在安卓开发中,动画是必不可少也是相当重要的,看了很多博客,似乎动画与自定义view决定了一个安卓开发者的上限,做了三年安卓,从一开始简单的逐帧动画到慢慢随着UI的进步开始使用属性动画,从不懂到慢慢加深理解,感觉自己会的越来越多,不会的也有很多,长话短说,除了我们常见的属性动画、补间动画、逐帧动画,还有系统的自带的动画,可以实现很多UI要求的而你觉得很费劲的动画,下面先上效果图:
大家可以看到 点击“展开课表”会有中间的列表展示出来,点击“收起课表”,列表会被逐渐隐藏。这就是个动画,至于那个箭头上方的半透明效果很简单,在属性设置个alpha就可以了。
那么该如何使用呢?
1.首先在动画的根布局,我这里是RelativeLayout,xml里的属性加上 android:animateLayoutChanges="true";这个看英文就知道是布局发生变化的动画开关。
至于布局代码,下面就是,RelativeLayout就两个元素,一个是上方的列表,一个是遮挡列表的箭头也是动画的触摸开关。
<RelativeLayout
android:id="@+id/rl_bottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true">
<LinearLayout
android:id="@+id/ll_time_table"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="@+id/rv_time_table"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:paddingTop="9dp"
android:paddingBottom="12dp"></android.support.v7.widget.RecyclerView>
</LinearLayout>
<LinearLayout
android:id="@+id/ll_bottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/ll_time_table"
android:animateLayoutChanges="true"
android:orientation="vertical">
<LinearLayout
android:id="@+id/ll_fold"
android:layout_width="match_parent"
android:layout_height="90dp"
android:background="@drawable/white_gradient"
android:gravity="center_horizontal"
android:orientation="vertical">
<ImageView
android:id="@+id/iv_fold"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_marginTop="30dp"
android:src="@mipmap/icon_fold" />
<TextView
android:id="@+id/tv_fold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="展开课表"
android:textColor="#ff666666"
android:textSize="10sp" />
</LinearLayout>
2.我们要动态改变布局代码。
private void handleTimeTableVisible() {
//在xml设置父布局支持动画
final ImageView imageView = new ImageView(getActivity());
imageView.setVisibility(View.GONE);
imageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
rlBottom.removeView(imageView);
}
});
rlBottom.addView(imageView, 0);
if (showTable) {
showTable = false;
tvFold.setText("展开课表");
ivFold.setImageResource(R.mipmap.icon_fold);
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) llBottom.getLayoutParams();
//要先移除之前的布局约束 不然相对布局更改不会发生变化
params.removeRule(RelativeLayout.BELOW);
params.addRule(RelativeLayout.ALIGN_TOP, R.id.ll_time_table);
llBottom.setLayoutParams(params);
} else {
showTable = true;
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) llBottom.getLayoutParams();
params.removeRule(RelativeLayout.ALIGN_TOP);
params.addRule(RelativeLayout.BELOW, R.id.ll_time_table);
llBottom.setLayoutParams(params);
tvFold.setText("收起课表");
ivFold.setImageResource(R.mipmap.icon_unfold);
}
}
就是这么简单,如果恰好帮到你,请帮忙点个赞或者评论下,谢谢。