ObjectAnimator實現菜單的彈出（扇形）

用ObjectAnimator 實現菜單的彈出

 

首先是菜單的圖片資源和佈局

 

佈局中使用FrameLaout 將菜單喚出對應的imageView放在佈局的最後面來隱藏菜單詳細內容。

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

    <ImageView
        android:id="@+id/imageView_b"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="5dp"
        android:paddingTop="5dp"
        android:layout_gravity="bottom|right"
        android:src="@drawable/b"/>
    <ImageView
        android:id="@+id/imageView_c"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="5dp"
        android:paddingTop="5dp"
        android:layout_gravity="bottom|right"
        android:src="@drawable/c"/>
    <ImageView
        android:id="@+id/imageView_d"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="5dp"
        android:paddingTop="5dp"
        android:layout_gravity="bottom|right"
        android:src="@drawable/d"/>
    <ImageView
        android:id="@+id/imageView_e"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="5dp"
        android:paddingTop="5dp"
        android:layout_gravity="bottom|right"
        android:src="@drawable/e"/>
    <ImageView
        android:id="@+id/imageView_f"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="5dp"
        android:paddingTop="5dp"
        android:layout_gravity="bottom|right"
        android:src="@drawable/f"/>

    <ImageView
        android:id="@+id/imageView_g"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="5dp"
        android:paddingTop="5dp"
        android:layout_gravity="bottom|right"
        android:src="@drawable/g" />
    <ImageView
        android:id="@+id/imageView_a"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="5dp"
        android:paddingTop="5dp"
        android:layout_gravity="bottom|right"
        android:src="@drawable/a"/>

</FrameLayout>

 

 

package com.a18470.mooc_animtest;import android.animation.AnimatorSet;import android.animation.ObjectAnimator;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.util.Log;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{    private int[] res = {R.id.imageView_a, R.id.imageView_b, R.id.imageView_c,            R.id.imageView_d, R.id.imageView_e, R.id.imageView_f, R.id.imageView_g};    private List<ImageView> imageViewList = new ArrayList<ImageView>();    private boolean flag = false;    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        for(int i=0;i<res.length;i++){            ImageView imageView = findViewById(res[i]);            imageView.setOnClickListener(this);            imageViewList.add(imageView);        }    }    @Override    public void onClick(View v) {        switch (v.getId()){            case R.id.imageView_a:                for (int i = 1; i < res.length; i++) {                    ImageView menu = imageViewList.get(i);                    double angle = Math.toRadians(i * (90 * 1.0 / (res.length - 1))); // 角度                    double radius = 450; // 半徑                    float distanceX = (float) (Math.cos(angle) * radius); // X座標偏移量                    float distanceY = (float) (Math.sin(angle) * radius); // Y座標偏移量                    ObjectAnimator animatorX;                    ObjectAnimator animatorY;                    if (flag) { // 若是菜單是打開的則關閉菜單                        animatorX = ObjectAnimator.ofFloat(menu, "translationX", -distanceX, 0f);                        animatorY = ObjectAnimator.ofFloat(menu, "translationY", -distanceY, 0f);                    } else { // 若是菜單是關閉的則打開菜單                        animatorX = ObjectAnimator.ofFloat(menu, "translationX", 0f, -distanceX);                        animatorY = ObjectAnimator.ofFloat(menu, "translationY", 0f, -distanceY);                    }                    AnimatorSet set = new AnimatorSet(); // X、Y軸同時移動                    set.playTogether(animatorX, animatorY);                    set.setDuration(500);                    set.setInterpolator(new BounceInterpolator());                    set.start();                }                flag = !flag;                break;            default:                Toast.makeText(MainActivity.this,"click"+v.getId(),Toast.LENGTH_SHORT).show();                break;        }    }}