android Auto animate layout updates

准备花一段时间把Android官方文档翻译下, 系统的学习下,今天学习layout布局文件自动添加动画

https://developer.android.google.cn/training/animation/layout

先来个官网介绍

Android offers pre-loaded animation that the system runs each time you make a change to the layout. All you need to do is set an attribute in the layout to tell the Android system to animate these layout changes, and system-default animations are carried out for you

Android提供了预加载的动画，每当您更改布局时，系统都会运行该动画。 您需要做的就是在布局中设置一个属性，以告知Android系统为这些布局更改设置动画，然后为您执行系统默认的动画

提示：如果要提供自定义布局动画，请创建LayoutTransition对象，然后使用setLayoutTransition（）方法将其提供给布局

使用

In your activity's layout XML file, set the android:animateLayoutChanges attribute to true for the layout that you want to enable animations for. For instance:

在您活动的布局XML文件中，将您要为其启用动画的布局的android：animateLayoutChanges属性设置为true。 例如：

<LinearLayout android:id="@+id/container"
    android:animateLayoutChanges="true"
    ...
/>

Add, update, or remove items from the layout

private ViewGroup containerView;
...
private void addItem() {
    View newView;
    ...
    containerView.addView(newView, 0);
}

上面全是官网的 现在写demo来看下怎么使用

布局文件：

<?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"
        android:orientation="vertical"
        >
    <LinearLayout
            android:id="@+id/activity_main_ll_root"
            android:layout_width="match_parent"
             android:layout_height="wrap_content"
              android:orientation="vertical"

                >
        <TextView
                android:id="@+id/activity_main_tv_text1"
                android:layout_width="match_parent"
                android:layout_height="40dp"
                android:text="张三"
                android:gravity="center"
                android:background="#fff"
             />
        <TextView
                android:id="@+id/activity_main_tv_text2"
                android:layout_width="match_parent"
                android:layout_height="40dp"
                android:text="李四"
                android:gravity="center"
                android:background="#fff"
                android:visibility="gone"
        />
        <TextView
                android:id="@+id/activity_main_tv_text3"
                android:layout_width="match_parent"
                android:layout_height="40dp"
                android:text="王五"
                android:gravity="center"
                android:background="#fff"

        />
    </LinearLayout>
    <Button
            android:id="@+id/activity_main_btn_chang"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="更新内容"
            android:layout_marginTop="50dp"
    />
</LinearLayout>

代码

package com.rxjava.autoanimateactivity;
import android.animation.LayoutTransition;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {
    private LinearLayout llRoot;
    private TextView tvText3;
    private TextView tvText2;
    private TextView tvText1;
    private Button btnChang;
    private int index = 0;
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        llRoot = findViewById(R.id.activity_main_ll_root);
        tvText3= findViewById(R.id.activity_main_tv_text3);
        tvText2= findViewById(R.id.activity_main_tv_text2);
        tvText1= findViewById(R.id.activity_main_tv_text1);
        btnChang = findViewById(R.id.activity_main_btn_chang);
        LayoutTransition layoutTransition = new LayoutTransition();

        layoutTransition.setDuration(200);
        llRoot.setLayoutTransition(layoutTransition);

        btnChang.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if(tvText2.getVisibility()==View.VISIBLE){
                    tvText2.setVisibility(View.GONE);
                }else{
                    tvText2.setVisibility(View.VISIBLE);
                }
            }
        });
    }
}

效果

这个效果不明细 给textview加个背景

现在实现下点击一步步隐藏三个textview效果

btnChang.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                 if(index==0){
                    index++;
                    llRoot.removeView(tvText3);
                }else if(index==1){
                    index++;
                    llRoot.removeView(tvText2);
                }else if(index==2){
                    index++;
                    llRoot.removeView(tvText1);
                }else if(index==3){
                     index++;
                     llRoot.addView(tvText1);
                 }else if(index==4){
                     index++;
                     llRoot.addView(tvText2);
                 }else if(index==5){
                     index++;
                     llRoot.addView(tvText3);
                 }
            }
        });

效果：

这个场景在很多地方都会用到,比如曹操或者滴滴打车就有类似的效果

比如点击现在就没有选择用车时间 这个view 如果是使用view的setVisibility来控制它显示和隐藏, 效果看起来就很硬生生的,这个时候就可以使用上面讲的LayoutTransition

使用LayoutTransition 可以在布局文件中添加属性android:animateLayoutChanges="true"，当然也可以使用它提供的类

是用类更好 可以设置动画的时间等其他。

比如还有就是在某个场景下容器view添加一个item view 会有这种效果,