王学岗属性动画上(十一)——属性动画的综合应用

一，前言；

嗨大家好，这次的动画内容是要把前几篇微博中用到的知识综合在一起，做出一个更有难度的效果。什么效果呢？先设置两个布局，一个隐藏，一个显示；
布局(类似于前几篇文章中的iv_zhangxin图片)实现如下效果：
1. 缩小
2. 透明度
3. 旋转
4. 平移

二： 看布局

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=".MainActivity" >

    <LinearLayout
        android:id="@+id/ll_show"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#ffff00"
        android:orientation="vertical" >

        <Button
            android:id="@+id/bt_show"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="显示" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/ll_hide"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:layout_alignParentBottom="true"
        android:background="#ff0000"
        android:orientation="vertical"
        android:visibility="invisible" >

        <Button
            android:id="@+id/bt_hide"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="隐藏" />
    </LinearLayout>

</RelativeLayout>

三：代码

注释很详细，应该可以看的懂

package com.example.zx;

import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.widget.Button;
import android.widget.LinearLayout;

@SuppressLint("NewApi")
public class MainActivity extends Activity implements OnClickListener {
    private Button bt_show, bt_hide;
    private LinearLayout ll_hide, ll_show;
    private int height;

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

    private void initView() {
        ll_hide = (LinearLayout) findViewById(R.id.ll_hide);
        // 这个方法看的不太明白不要紧，可以先跳过去
        // 监听当前视图是否绘制成功
        ll_hide.getViewTreeObserver().addOnGlobalLayoutListener(
                new OnGlobalLayoutListener() {

                    // 视图是否绘制完成
                    // 已经绘制完成，回调onGloalLayout
                    @Override
                    public void onGlobalLayout() {
                        height = ll_hide.getHeight();
                        // 观察者，观察视图是否绘制完成，完成则回调下
                        ll_hide.getViewTreeObserver()
                                .removeOnGlobalLayoutListener(this);
                    }
                });
        ll_show = (LinearLayout) findViewById(R.id.ll_show);
        bt_show = (Button) findViewById(R.id.bt_show);
        bt_hide = (Button) findViewById(R.id.bt_hide);
        bt_hide.setOnClickListener(this);
        bt_show.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
        case R.id.bt_hide:

            break;
        case R.id.bt_show:
            showLayout();
            break;

        default:
            break;
        }
    }

    private void showLayout() {
        // 缩放动画
        ObjectAnimator ll_show_scaleX = ObjectAnimator.ofFloat(ll_show,
                "scaleX", 1.0f, 0.8f).setDuration(300);
        ObjectAnimator ll_show_scaleY = ObjectAnimator.ofFloat(ll_show,
                "scaleY", 1.0f, 0.8f).setDuration(300);

        // 透明度
        ObjectAnimator ll_show_alpha = ObjectAnimator.ofFloat(ll_show, "alpha",
                1.0f, 0.5f).setDuration(300);
        // 旋转，先顺时针旋转，在逆时针旋转
        // 顺时针旋转20度
        // 执行完旋转效果后，布局沿着X，Y轴进行了移动,就是说这个布局缩小了，不再是填充父容器，为什么出现这种情况我也搞不清楚。
        ObjectAnimator ll_show_rotationX_lock = ObjectAnimator.ofFloat(ll_show,
                "rotationX", 0f, 20f).setDuration(200);
        ObjectAnimator ll_show_rotationX_unlock = ObjectAnimator.ofFloat(
                ll_show, "rotationX", 20f, 0f).setDuration(200);
        // 逆时针延迟执行，同时执行看不到动画效果
        ll_show_rotationX_unlock.setStartDelay(200);
        // 平移效果
        // 使布局沿着y轴向上运动
        ObjectAnimator ll_show_translationY = ObjectAnimator.ofFloat(ll_show,
                "translationY", 0f, -30f).setDuration(300);
        // 重点地方到了哦
        // 下面的效果是黄色隐藏，红色显示,height为ll_hide的高度
        ObjectAnimator ll_hide_translationY = ObjectAnimator.ofFloat(ll_hide,
                "translationY", height, 0).setDuration(300);
        // 此时，ll_hide处于隐藏状态，给ll_hide添加一个监听，当ll_hide执行的时候显示出来。
        ll_hide_translationY.addListener(new AnimatorListenerAdapter() {
            // 动画开始执行的时候，ll_hide显示出来
            @Override
            public void onAnimationStart(Animator animation) {
                // TODO Auto-generated method stub
                super.onAnimationStart(animation);
                ll_hide.setVisibility(View.VISIBLE);
            }
        });
        AnimatorSet animatorSet_show = new AnimatorSet();
        animatorSet_show.playTogether(ll_show_scaleX, ll_show_scaleY,
                ll_show_alpha, ll_show_rotationX_lock,
                ll_show_rotationX_unlock, ll_show_translationY,
                ll_hide_translationY);
        animatorSet_show.start();
    }
//隐藏功能自己实现啦
}