android属性动画弹出菜单实例

      本例子用属性动画区别于传统动画。点击图标后会从图标向下弹出7个子菜单图标，且具有动画效果。再次点击，则7个子菜单图标收缩回原图标处。动画效果为落地弹跳小球效果。

布局文件：activity_main.xml

<FrameLayout 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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.fxj.animor.MainActivity" >


    <ImageView
        android:id="@+id/iv_g"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/g" />


    <ImageView
        android:id="@+id/iv_f"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/f" />


    <ImageView
        android:id="@+id/iv_e"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/e" />


    <ImageView
        android:id="@+id/iv_d"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/d" />


    <ImageView
        android:id="@+id/iv_c"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/c" />


    <ImageView
        android:id="@+id/iv_b"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/b" />


    <ImageView
        android:id="@+id/iv_a"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/a" />


    <ImageView
        android:id="@+id/iv_s"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/s" />


</FrameLayout>

MainActivity.java文件：

package com.fxj.animor;


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


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


public class MainActivity extends ActionBarActivity implements OnClickListener {
// ImageViewId
private int[] imageIds = new int[] { R.id.iv_s, R.id.iv_a, R.id.iv_b,
R.id.iv_c, R.id.iv_d, R.id.iv_e, R.id.iv_f, R.id.iv_g


};
// 盛放ImageView的list
private List<ImageView> imageList = new ArrayList<ImageView>();
// 菜单弹出缩回标志
private boolean flag = true;


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// for循环实例化控件，并设置监听
for (int i = 0; i < imageIds.length; i++) {
ImageView image = (ImageView) findViewById(imageIds[i]);
image.setOnClickListener(this);
imageList.add(image);
}
}


// 点击事件监听
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.iv_s:
if (flag) {
// 开始动画，即弹出菜单
startAnimator();
} else {
// 结束动画，即收回菜单
endAnimator();
}
break;
default:
Toast.makeText(this, "item" + v.getId() + "被点击了。",
Toast.LENGTH_SHORT).show();
break;
}


}


// 结束动画，即收回菜单
private void endAnimator() {
for (int i = 1; i < imageIds.length; i++) {
// 定义属性动画。与弹出菜单时相反，属性是translationY，Y方向从i*30偏移到0
ObjectAnimator animator = ObjectAnimator.ofFloat(imageList.get(i),
"translationY", i * 30f, 0f);
// 设置动画时间
animator.setDuration(500);
// 设置开始播放动画的时延，为了让图标有依次弹出的效果
animator.setStartDelay(i * 300);
// 设置数学插入器。使动画有落地弹跳的效果，而不是线性的
animator.setInterpolator(new BounceInterpolator());
// 开始动画
animator.start();
flag = true;
}


}


// 开始动画，即弹出菜单
private void startAnimator() {


for (int i = 1; i < imageIds.length; i++) {
// 定义属性动画。属性是translationY，Y方向从0偏移i*30
ObjectAnimator animator = ObjectAnimator.ofFloat(imageList.get(i),
"translationY", 0f, i * 30f);
// 设置动画时间
animator.setDuration(500);
// 设置开始播放动画的时延，为了让图标有依次弹出的效果
animator.setStartDelay(i * 300);
// 设置数学插入器。使动画有落地弹跳的效果，而不是线性的
animator.setInterpolator(new BounceInterpolator());
// 开始动画
animator.start();
flag = false;
}


}
}

运行效果：

开始时

动画弹出中

动画弹出后

每个弹出的菜单设置了监听事件，可以被点击。

菜单收回中。

结束。