属性动画之菜单弹出式

此文，仅做为个人学习Android，记录成长以及方便复习！

利用属性动画配置出点击菜单，弹出子菜单！

设置UI界面，存放很多按钮的ImageView重叠，点击第一个图片的时候，弹出底下的ImageView

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/img_b"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/b"/>
    <ImageView
        android:id="@+id/img_c"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/c"/>
    <ImageView
        android:id="@+id/img_d"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/d"/>
    <ImageView
        android:id="@+id/img_e"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/e"/>
    <ImageView
        android:id="@+id/img_f"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/f"/>
    <ImageView
        android:id="@+id/img_g"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/g"/>
    <ImageView
        android:id="@+id/img_h"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/h"/>
    <ImageView
        android:id="@+id/img_a"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/a"
        android:layout_marginTop="-3dp"
        android:layout_marginLeft="-3dp"/>


</FrameLayout>

接下来是重头戏，通过循环获取每个ImageView，然后控制其属性动画

package com.example.qqazl001.animation;

import android.animation.ObjectAnimator;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.BounceInterpolator;
import android.widget.ImageView;
import android.widget.Toast;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity implements View.OnClickListener{
    //定义所有ImageView,存入数组
    private int[] res={R.id.img_a,R.id.img_b,R.id.img_c,R.id.img_d,R.id.img_e,R.id.img_f,R.id.img_g,R.id.img_h};
    //定义数组，存放实例化的ImageView
    //判断菜单是否展开
    private boolean flag = true;
    private List<ImageView> list = new ArrayList<ImageView>();
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        for(int i=0;i<res.length;i++){
            //循环实例化ImageView
            ImageView imageView = findViewById(res[i]);
            //添加监听事件
            imageView.setOnClickListener(this);
            //加入集合
            list.add(imageView);
        }
    }

    @Override
    public void onClick(View view) {
        switch(view.getId()){
            case R.id.img_a:
               if(flag == true){
                   startAnim();
                   //startAnimH();
               }else{
                   closeAnim();
                   //closeAnimH();
               }
                break;
            default:
                Toast.makeText(this,view.getId()+"",Toast.LENGTH_SHORT).show();
               break;
        }
    }

    //垂直展厅菜单方法
    private void startAnim() {
        //i从1开始，因为第一个按钮不需要动画
        for(int i = 1; i<res.length; i++){
            //Y轴平移
            ObjectAnimator animator =  ObjectAnimator.ofFloat(list.get(i),"translationY",0F,i*180);
            //动画时长000毫秒
            animator.setDuration(1000);
            //停顿时长
            animator.setStartDelay(i*300);
            //加入回弹的插值器,范围在0F到i*180的移动过程
            animator.setInterpolator(new BounceInterpolator());
            //启动动画
            animator.start();
            //点击开启之后设置为flase
            flag = false;
        }
    }


    //垂直收回菜单方法
    private void closeAnim() {
        for(int i=res.length-1;i>0; i--){
            ObjectAnimator animator =  ObjectAnimator.ofFloat(list.get(i),"translationY",i*180,0F);
            animator.setDuration(1000);
            animator.setStartDelay(i*300);
            animator.setInterpolator(new BounceInterpolator());
            animator.start();
            flag = true;
        }
    }


    //环形菜单展开
    public void startAnimH(){
        int r=500;
        for(int i=1;i<res.length;i++){
            float y = (float) (r * Math.sin((Math.PI / 2) / (res.length - 2) * (i - 1)));
            float x = (float) (r * Math.cos((Math.PI / 2) / (res.length - 2) * (i - 1)));
            ObjectAnimator animator = ObjectAnimator.ofFloat(list.get(i),"translationY",0F,y);
            ObjectAnimator animator2 = ObjectAnimator.ofFloat(list.get(i),"translationX",0F,x);
            animator.setDuration(1000);
            animator.setInterpolator(new BounceInterpolator());
            animator.setStartDelay(i*300);
            animator.start();
            animator2.setDuration(1000);
            animator2.setInterpolator(new BounceInterpolator());
            animator2.setStartDelay(i*300);
            animator2.start();
            flag=false;
        }
    }

    //环形菜单关闭
    public void closeAnimH(){
        int r=500;
        for(int i=1;i<res.length;i++){
            float y = (float) (r * Math.sin((Math.PI / 2) / (res.length - 2) * (i - 1)));
            float x = (float) (r * Math.cos((Math.PI / 2) / (res.length - 2) * (i - 1)));
            ObjectAnimator animator = ObjectAnimator.ofFloat(list.get(i),"translationY",y,0F);
            ObjectAnimator animator2 = ObjectAnimator.ofFloat(list.get(i),"translationX",x,0F);
            animator.setDuration(1000);
            animator.setInterpolator(new BounceInterpolator());
            animator.setStartDelay(i*300);
            animator.start();
            animator2.setDuration(1000);
            animator2.setInterpolator(new BounceInterpolator());
            animator2.setStartDelay(i*300);
            animator2.start();
            flag=true;
        }
    }
}

一下是2个动画效果，一个垂直掉落，一个环形，每个按钮都有监听响应事件