Android 动画之LayoutAnimation和LayoutTransition

LayoutAnimation用于给ViewGroup里面内容设置动画效果，可以在java代码中设置和xml中设置

首先在anim文件夹下建一个layoutAnimation的xml文件

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

animationOrder：子view显示的顺序，有三种值，normal为默认，reverse为倒序，random是随机

delay：每个子view出现的延迟时间，是一个float类型，取值在0到1，动画的时长乘以这个float类型的值，就是延迟的时间，比如动画1000ms，delay设置为0.5那么，每个动画延迟就是500ms

animation：引用的动画效果

在anim文件下的anim_home

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

很简单这就是一个缩放加透明度变化的动画

主界面就是一个GridView，里面放置的图片加文字

要给这个GridView添加LayoutAnimation只需要在GridView中添加

android:layoutAnimation="@anim/layout_home"

layout_home就是之前在建立的LayoutAnimation

还有一种方式是在java中添加

 Animation animation = AnimationUtils.loadAnimation(this, R.anim.anim_home);
        LayoutAnimationController controller = new LayoutAnimationController(animation, 0.2f);
        controller.setOrder(LayoutAnimationController.ORDER_NORMAL);
        mGridView.setLayoutAnimation(controller);

这样简单的就实现了。

LayoutTransition

LayoutTransition可以实现在ViewGroup中添加，删除，隐藏，显示View时，实现view的动画效果或者ViewGroup的动画。可以自定义这些动画，通过setAnimator() 方法把它们设置进一个 LayoutTransition 对象中去。

这是在GridLayout里面添加Button，只需要设置以下代码就可以实现的效果

 //创建对象，设置到布局容器
        mTransition = new LayoutTransition();
        mGridLayout.setLayoutTransition(mTransition);

当然我们想要运用自定义的动画效果，LayoutTransition中定义了下面几种动画的类型

LayoutTransition.APPEARING：子View出现时的动画

LayoutTransition.DISAPPEARING：子View消失时的动画

LayoutTransition.CHANGE_APPEARING：子View出现时其他子View的动画

LayoutTransition.CHANGE_DISAPPEARING：子View消失时其他子View的动画

看看下面的具体例子，先看效果，可能录制问题效果看起来不是很好

这实现的就是在一个GridLayout里面添加Button，下面是具体的代码，关键地方都有注释

public class MainActivity extends AppCompatActivity {

    private Button mButtonAdd;
    private Button mButtonDelete;
    private GridLayout mGridLayout;
    private LayoutTransition mTransition;
    private int buttonNumbers;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mButtonAdd = (Button) findViewById(R.id.bt1);
        mButtonDelete = (Button) findViewById(R.id.bt2);
        mGridLayout = (GridLayout) findViewById(R.id.gridView);

        mButtonDelete.setOnClickListener(onClickListener);
        mButtonAdd.setOnClickListener(onClickListener);

        //创建对象，设置到布局容器
        mTransition = new LayoutTransition();
        mGridLayout.setLayoutTransition(mTransition);

        customTransition();
    }

    private View.OnClickListener onClickListener = new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            switch (v.getId()) {
                case R.id.bt1:
                    addButton();
                    break;
                case R.id.bt2:
                    resetButton();
                    break;
            }
        }
    };

    private void customTransition() {
        /**
         * Add Button
         * LayoutTransition.APPEARING
         * 增加一个Button时，设置该Button的动画效果
         */
        ObjectAnimator animatorAppearing = ObjectAnimator.ofFloat(null, "rotationY", 180.0f, 0.0f)
                .setDuration(mTransition.getDuration(LayoutTransition.APPEARING));
        animatorAppearing.setInterpolator(new AccelerateInterpolator());
        mTransition.setAnimator(LayoutTransition.APPEARING, animatorAppearing);
        animatorAppearing.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                super.onAnimationEnd(animation);
                //动画完成的监听
            }
        });

        /**
         * Add Button
         * LayoutTransition.CHANGE_APPEARING
         * 当增加一个Button时，设置其他Button的动画效果
         */
        //动画间隔
        mTransition.setStagger(LayoutTransition.CHANGE_APPEARING, 50);
        mTransition.setStagger(LayoutTransition.CHANGE_DISAPPEARING, 50);
        //这里照着写，不然没效果
        PropertyValuesHolder pvhLeft =
                PropertyValuesHolder.ofInt("left", 0, 1);
        PropertyValuesHolder pvhTop =
                PropertyValuesHolder.ofInt("top", 0, 1);
        PropertyValuesHolder pvhRight =
                PropertyValuesHolder.ofInt("right", 0, 1);
        PropertyValuesHolder pvhBottom =
                PropertyValuesHolder.ofInt("bottom", 0, 1);
        //缩放动画
        PropertyValuesHolder mHolderScaleX = PropertyValuesHolder.ofFloat("scaleX", 1.0f, 0.0f, 1.0f);
        PropertyValuesHolder mHolderScaleY = PropertyValuesHolder.ofFloat("scaleY", 1.0f, 0.0f, 1.0f);
        ObjectAnimator mObjectAnimatorChangeAppearing = ObjectAnimator.ofPropertyValuesHolder(this, pvhLeft,
                pvhTop, pvhRight, pvhBottom, mHolderScaleX, mHolderScaleY).setDuration(mTransition
                .getDuration(LayoutTransition.CHANGE_APPEARING));
        mTransition.setAnimator(LayoutTransition.CHANGE_APPEARING, mObjectAnimatorChangeAppearing);


        /**
         * Delete Button
         * LayoutTransition.DISAPPEARING
         * 当删除一个Button时，设置该Button的动画效果
         */
        ObjectAnimator mObjectAnimatorDisAppearing = ObjectAnimator.ofFloat(null, "rotationX", 0.0f, 90.0f)
                .setDuration(mTransition.getDuration(LayoutTransition.DISAPPEARING));
        mTransition.setAnimator(LayoutTransition.DISAPPEARING, mObjectAnimatorDisAppearing);


        /**
         * Delete Button
         * LayoutTransition.CHANGE_DISAPPEARING
         * 当删除一个Button时，设置其它Button的动画效果
         */
//        Keyframe 对象中包含了一个时间/属性值的键值对，用于定义某个时刻的动画状态。
        Keyframe mKeyframeStart = Keyframe.ofFloat(0.0f, 0.0f);
        Keyframe mKeyframeMiddle = Keyframe.ofFloat(0.5f, 180.0f);
        Keyframe mKeyframeEndBefore = Keyframe.ofFloat(0.999f, 360.0f);
        Keyframe mKeyframeEnd = Keyframe.ofFloat(1.0f, 0.0f);

        PropertyValuesHolder mPropertyValuesHolder = PropertyValuesHolder.ofKeyframe("rotation",
                mKeyframeStart, mKeyframeMiddle, mKeyframeEndBefore, mKeyframeEnd);
        ObjectAnimator mObjectAnimatorChangeDisAppearing = ObjectAnimator.ofPropertyValuesHolder(this, pvhLeft,
                pvhTop, pvhRight, pvhBottom, mPropertyValuesHolder)
                .setDuration(mTransition.getDuration(LayoutTransition.CHANGE_DISAPPEARING));
        mTransition.setAnimator(LayoutTransition.CHANGE_DISAPPEARING, mObjectAnimatorChangeDisAppearing);

    }

    /**
     * 增加Button
     */
    public void addButton() {
        Button mButton = new Button(this);
        LinearLayout.LayoutParams mLayoutParams = new LinearLayout.LayoutParams(200, 200);
        mButton.setLayoutParams(mLayoutParams);
        mButton.setText(String.valueOf(buttonNumbers++));
        mButton.setTextColor(Color.rgb(0, 0, 0));
        if (buttonNumbers % 2 == 1) {
            mButton.setBackgroundColor(Color.rgb(45, 118, 87));
        } else {
            mButton.setBackgroundColor(Color.rgb(225, 24, 0));
        }
        mButton.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                mGridLayout.removeView(v);
            }
        });

        mGridLayout.addView(mButton, Math.min(1, mGridLayout.getChildCount()));
    }

    /**
     * 删除所有的Button,重置GridLayout
     */
    public void resetButton() {
        mGridLayout.removeAllViews();
        buttonNumbers = 1;
    }

}