1 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  2     xmlns:tools="http://schemas.android.com/tools"  3     android:layout_width="match_parent"  4     android:layout_height="match_parent"  5     tools:context=".MainActivity" >  6   7     <TextView  8         android:layout_width="wrap_content"  9         android:layout_height="wrap_content" 10         android:layout_centerHorizontal="true" 11         android:layout_centerVertical="true" 12         android:text="@string/hello_world" /> 13  14     <!-- 底部半圆黑块 --> 15     <RelativeLayout 16         android:id="@+id/level1" 17         android:layout_width="100dp" 18         android:layout_height="50dp" 19         android:layout_alignParentBottom="true" 20         android:layout_centerHorizontal="true" 21         android:background="@drawable/level1" > 22        <!-- 小房子图片 --> 23         <ImageView 24             android:id="@+id/icon_home" 25             android:layout_width="wrap_content" 26             android:layout_height="wrap_content" 27             android:layout_centerInParent="true" 28             android:background="@drawable/icon_home" /> 29     </RelativeLayout> 30  31     <!-- 中间半圆 --> 32     <RelativeLayout 33         android:id="@+id/level2" 34         android:layout_width="180dp" 35         android:layout_height="90dp" 36         android:layout_alignParentBottom="true" 37         android:layout_centerHorizontal="true" 38         android:background="@drawable/level2" > 39         <!-- 查询图标 --> 40         <ImageView 41             android:id="@+id/icon_search" 42             android:layout_width="wrap_content" 43             android:layout_height="wrap_content" 44             android:layout_alignParentBottom="true" 45             android:layout_margin="10dp" 46             android:background="@drawable/icon_search" /> 47         <!-- 三杠图标 --> 48         <ImageView 49             android:id="@+id/icon_menu" 50             android:layout_width="wrap_content" 51             android:layout_height="wrap_content" 52             android:layout_centerHorizontal="true" 53             android:layout_marginTop="5dp" 54             android:background="@drawable/icon_menu" /> 55         <!-- 倾斜感叹号 --> 56         <ImageView 57             android:id="@+id/icon_myyouku" 58             android:layout_width="wrap_content" 59             android:layout_height="wrap_content" 60             android:layout_alignParentBottom="true" 61             android:layout_alignParentRight="true" 62             android:layout_margin="10dp" 63             android:background="@drawable/icon_myyouku" /> 64     </RelativeLayout> 65  66     <!-- 顶端半圆 --> 67     <RelativeLayout 68         android:id="@+id/level3" 69         android:layout_width="280dp" 70         android:layout_height="140dp" 71         android:layout_alignParentBottom="true" 72         android:layout_centerHorizontal="true" 73         android:background="@drawable/level3" > 74         <!-- 音乐图标 --> 75         <ImageView 76             android:id="@+id/channel1" 77             android:layout_width="wrap_content" 78             android:layout_height="wrap_content" 79             android:layout_alignParentBottom="true" 80             android:layout_marginBottom="10dp" 81             android:layout_marginLeft="10dp" 82             android:background="@drawable/channel1" /> 83         <!-- 电影图标 --> 84         <ImageView 85             android:id="@+id/channel2" 86             android:layout_width="wrap_content" 87             android:layout_height="wrap_content" 88             android:layout_above="@id/channel1" 89             android:layout_alignLeft="@id/channel1" 90             android:layout_marginBottom="6dp" 91             android:layout_marginLeft="20dp" 92             android:background="@drawable/channel2" /> 93        <!-- 小猴图标 --> 94         <ImageView 95             android:id="@+id/channel3" 96             android:layout_width="wrap_content" 97             android:layout_height="wrap_content" 98             android:layout_above="@id/channel2" 99             android:layout_alignLeft="@id/channel2"100             android:layout_marginBottom="6dp"101             android:layout_marginLeft="30dp"102             android:background="@drawable/channel3" />103         <!--  -->104         <ImageView105             android:id="@+id/channel4"106             android:layout_width="wrap_content"107             android:layout_height="wrap_content"108             android:layout_centerHorizontal="true"109             android:layout_marginTop="5dp"110             android:background="@drawable/channel4" />111         <!--  -->112         <ImageView113             android:id="@+id/channel7"114             android:layout_width="wrap_content"115             android:layout_height="wrap_content"116             android:layout_alignParentBottom="true"117             android:layout_alignParentRight="true"118             android:layout_marginBottom="10dp"119             android:layout_marginRight="10dp"120             android:background="@drawable/channel7" />121         <!--  -->122         <ImageView123             android:id="@+id/channel6"124             android:layout_width="wrap_content"125             android:layout_height="wrap_content"126             android:layout_above="@id/channel7"127             android:layout_alignRight="@id/channel7"128             android:layout_marginBottom="6dp"129             android:layout_marginRight="20dp"130             android:background="@drawable/channel6" />131         <!--  -->132         <ImageView133             android:id="@+id/channel5"134             android:layout_width="wrap_content"135             android:layout_height="wrap_content"136             android:layout_above="@id/channel6"137             android:layout_alignRight="@id/channel6"138             android:layout_marginBottom="6dp"139             android:layout_marginRight="30dp"140             android:background="@drawable/channel5" />141     </RelativeLayout>142 143 </RelativeLayout>

 1 package com.example.testdemo; 2  3 import android.view.animation.RotateAnimation; 4 import android.widget.RelativeLayout; 5  6 public class MyUtils { 7  8     /** 9      * 让指定的view 执行 旋转离开的动画10      * @param view11      */12     public static void startAnimOut(RelativeLayout view) {13         startAnimOut(view, 0);14     }15 16     /**17      * 让指定view 延时 执行旋转离开的动画，18      * @param offset19      *            延时的时间20      */21     public static void startAnimOut(RelativeLayout view, long offset) {22         // 默认圆为 为view的左上角， 水平向右 为 0度 顺时针旋转度数增加23         RotateAnimation animation = new RotateAnimation(0, 180,24                 view.getWidth() / 2, view.getHeight());25         // 设置运行的时间26         animation.setDuration(500); 27         // 动画执行完以后，保持最后的状态28         animation.setFillAfter(true); 29         // 设置延时执行的时间30         animation.setStartOffset(offset); 31 32         view.startAnimation(animation);33     }34 35     /**36      * 让指定的view 执行 旋转进入的动画37      * @param view38      */39     public static void startAnimIn(RelativeLayout view) {40         startAnimIn(view, 0);41     }42 43     /**44      * 让指定的view 延时执行 旋转进入的动画45      * @param i46      *            延时的时间47      */48     public static void startAnimIn(RelativeLayout view, int i) {49         // 默认圆为 为view的左上角， 水平向右 为 0度 顺时针旋转度数增加50         RotateAnimation animation = new RotateAnimation(180, 360,51                 view.getWidth() / 2, view.getHeight());52         // 设置运行的时间53         animation.setDuration(500); 54         // 动画执行完以后，保持最后的状态55         animation.setFillAfter(true); 56         // 设置延时执行的时间57         animation.setStartOffset(i); 58         view.startAnimation(animation);59     }60 61 }

  1 package com.example.testdemo;  2   3 import android.app.Activity;  4 import android.os.Bundle;  5 import android.view.KeyEvent;  6 import android.view.View;  7 import android.view.View.OnClickListener;  8 import android.widget.ImageView;  9 import android.widget.RelativeLayout; 10  11 public class MainActivity extends Activity implements OnClickListener { 12  13     private ImageView icon_menu; 14     private ImageView icon_home; 15  16     private RelativeLayout level1; 17     private RelativeLayout level2; 18     private RelativeLayout level3; 19     /** 20      * 判断 第3级菜单是否显示 true 为显示 21      */ 22     private boolean isLevel3Show = true; 23     /** 24      * 判断 第2级菜单是否显示 true 为显示 25      */ 26     private boolean isLevel2Show = true; 27     /** 28      * 判断 第1级菜单是否显示 true 为显示 29      */ 30     private boolean isLevel1show = true; 31  32     @Override 33     protected void onCreate(Bundle savedInstanceState) { 34         super.onCreate(savedInstanceState); 35         setContentView(R.layout.activity_main); 36  37         icon_home = (ImageView) findViewById(R.id.icon_home); 38         icon_menu = (ImageView) findViewById(R.id.icon_menu); 39  40         level1 = (RelativeLayout) findViewById(R.id.level1); 41         level2 = (RelativeLayout) findViewById(R.id.level2); 42         level3 = (RelativeLayout) findViewById(R.id.level3); 43  44         icon_home.setOnClickListener(this); 45         icon_menu.setOnClickListener(this); 46  47     } 48  49     @Override 50     public void onClick(View v) { 51         switch (v.getId()) { 52         // 处理 menu 图标的点击事件 53         case R.id.icon_menu: 54             // 如果第3级菜单是显示状态，那么将其隐藏 55             if (isLevel3Show) { 56                 // 隐藏 第3级菜单 57                 MyUtils.startAnimOut(level3); 58             } else { 59                 // 如果第3级菜单是隐藏状态，那么将其显示 60                 MyUtils.startAnimIn(level3); 61             } 62  63             isLevel3Show = !isLevel3Show; 64  65             break; 66         // 处理 home 图标 的点击事件 67         case R.id.icon_home: 68             // 如果第2级菜单是显示状态，那么就隐藏，2，3级菜单 69             if (isLevel2Show) { 70                 MyUtils.startAnimOut(level2); 71                 isLevel2Show = false; 72                 // 如果此时，第3级菜单也显示，那也将其隐藏 73                 if (isLevel3Show) { 74                     MyUtils.startAnimOut(level3, 200); 75                     isLevel3Show = false; 76                 } 77             } else { 78                 // 如果第2级菜单是隐藏状态，那么就显示2级菜单 79                 MyUtils.startAnimIn(level2); 80                 isLevel2Show = true; 81             } 82             break; 83         } 84     } 85  86     /** 87      * 改变第1级菜单的状态 88      */ 89     private void changeLevel1State() { 90         // 如果第1级菜单是显示状态，那么就隐藏 1，2，3级菜单 91         if (isLevel1show) { 92             MyUtils.startAnimOut(level1); 93             isLevel1show = false; 94             // 判断2级菜单是否显示 95             if (isLevel2Show) { 96                 MyUtils.startAnimOut(level2, 100); 97                 isLevel2Show = false; 98                 // 判断3级菜单是否显示 99                 if (isLevel3Show) {100                     MyUtils.startAnimOut(level3, 200);101                     isLevel3Show = false;102                 }103             }104         } else {105             // 如果第1级菜单是隐藏状态，那么就显示 1，2级菜单106             MyUtils.startAnimIn(level1);107             isLevel1show = true;108             MyUtils.startAnimIn(level2, 200);109             isLevel2Show = true;110         }111 112     }113 114     @Override115     /**116      * 响应按键的动作117      */118     public boolean onKeyDown(int keyCode, KeyEvent event) {119         // 监听 menu 按键120         if (keyCode == KeyEvent.KEYCODE_MENU) { 121             changeLevel1State();122         }123         return super.onKeyDown(keyCode, event);124     }125 126 }