浅谈属性动画简单使用之实现卫星菜单(二)

    大家对于卫星菜单应该都不陌生了,事实上这个菜单假设能合适运用到我们的APP项目中。确实是一个不错的选择，交互性非常好。

在写Demo之前我也上网搜了一些关于卫星菜单的实现，感觉好多人实现卫星菜单这样的动画，採用的是补间动画。而且代码还不少，通过上一讲我们知道，补间动画不具备与用户交互的特点，就比方卫星菜单展开后，产生非常多子菜单有非常多的点击事件，会发现产生点击事件的位置不会随着补间动画而产生位置改变而改变。反而点击事件一直保存在初始的位置。

当然补间动画也能做。那就须要产生动画后发生位置的改变，而且也须要将点击事件触发的位置随着动画改变而改变。这样实现起来，可能非常麻烦。今天我给大家带来的是用属性动画来实现卫星菜单，用了后你会发现。核心代码只100行左右就能完毕。而且能够利用属性动画的特点，它具备与用户交互的特点。它的点击事件触发位置，会随着动画的位置改变而改变。说白了属性动画实质就是修修改画的属性，而补间动画则是不断调用draw()方法不断重绘来达到一种动画的效果。

   实现卫星菜单的第一步:

   分析一下，这样卫星菜单怎么实现？实现该菜单对布局有什么要求？

首先，来分析一下布局。布局应该是这种，肯定有一个button。而且其它的子菜单都是重叠在第一个可见button以下，其它的子菜单都是不可见的。当点击最上面的一个button时，其它子菜单则呈1/4的圆弧显示，当再次点击，将这些button又一次回到原来的位置，隐藏起来。

所以这样布局大家应该想到了什么布局吧,我们应该使用帧布局（FrameLayout），将几个ImageView重叠在一起，而且让第一个显示的button放在最后，这样就会第一个显示了。

<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" >

    <ImageView
        android:id="@+id/index2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="5dp"
        android:src="@drawable/b" />

    <ImageView
        android:id="@+id/index3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="5dp"
        android:src="@drawable/c" />

    <ImageView
        android:id="@+id/index4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="5dp"
        android:src="@drawable/d" />

    <ImageView
        android:id="@+id/index5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="5dp"
        android:src="@drawable/e" />

    <ImageView
        android:id="@+id/index6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="5dp"
        android:src="@drawable/f" />

    <ImageView
        android:id="@+id/index7"
        android:layout_width="wrap_content"
        android:layout_height=&q