PopMenu效果的学习

PopMenu效果的学习

看到很多的程序里面都用了PopMenu的效果，给人的体验非常好，今天也学着做了一个，效果如下：

PopMenu.java

[java]  view plain copy

1. public class PopMenu extends Activity {  
2.     private int SCREEN_WIDTH;  
3.     private int SCREEN_HEIGHT;  
4.     private final static int MENU_CREATE_DIRECTORY = 0;  
5.     private final static int MENU_CREATE_FILE = 1;  
6.     private final static int MENU_PASTE = 2;  
7.     public final static int MENU_SEARCH = 3;  
8.     private final static int MENU_SHOW_COPY_DIALOG = 4;  
9.     private final static int MENU_APK_MANAGER = 5;  
10.     private final static int MENU_SETTING = 6;  
11.     private final static int MENU_SET_VIEW_STYLE = 7;  
12.     private final static int MENU_FILE_LIB = 8;  
13.     private final static int MENU_FINISH_ACTIVITY = 9;  
14.     private LinearLayout appMenu;  
15.     private Animation menuShowAnimation;  
16.     private Animation menuHideAnimation;  
17.     @Override  
18.     public void onCreate(Bundle savedInstanceState) {  
19.         super.onCreate(savedInstanceState);  
20.         setContentView(R.layout.main);  
21.         SCREEN_WIDTH = getResources().getDisplayMetrics().widthPixels;  
22.         SCREEN_HEIGHT = getResources().getDisplayMetrics().heightPixels;  
23.         initAppMenu();  
24.     }  
25.     private void initAppMenu() {  
26.         appMenu = (LinearLayout) findViewById(R.id.appMenu);  
27.         LinearLayout row = (LinearLayout) appMenu.findViewById(R.id.appRow1);  
28.         int[] drRes = { R.drawable.newfolder, R.drawable.newfile,  
29.                 R.drawable.paste, R.drawable.search, R.drawable.dialog,  
30.                 R.drawable.apkmanager, R.drawable.setting, R.drawable.multicon,  
31.                 R.drawable.filelib, R.drawable.close };  
32.         String[] names = getResources().getStringArray(R.array.appnames);  
33.         LayoutInflater inflater = getLayoutInflater();  
34.         View.OnClickListener listener = new View.OnClickListener() {  
35.             @Override  
36.             public void onClick(View v) {  
37.                 appMenuOnClick(v.getId());  
38.                 hideAppMenu();  
39.             }  
40.         };  
41.         for (int i = 0; i < 10; i++) {  
42.             if (i == 5) {  
43.                 row = (LinearLayout) appMenu.findViewById(R.id.appRow2);  
44.             }  
45.             RelativeLayout rowItem = (RelativeLayout) inflater.inflate(  
46.                     R.layout.appmenuitem, null);  
47.             ImageButton icon = (ImageButton) rowItem  
48.                     .findViewById(R.id.menuicon);  
49.             TextView name = (TextView) rowItem.findViewById(R.id.menuname);  
50.             icon.setBackgroundResource(drRes[i]);  
51.             icon.setId(i);  
52.             name.setText(names[i]);  
53.             icon.setOnClickListener(listener);  
54.             row.addView(rowItem);  
55.         }  
56.     }  
57.     private void appMenuOnClick(int whitch) {  
58.         switch (whitch) {  
59.         case MENU_CREATE_DIRECTORY:  
60.             Toast.makeText(this, "Create Directory", Toast.LENGTH_LONG).show();  
61.             break;  
62.         case MENU_CREATE_FILE:  
63.             Toast.makeText(this, "Create File", Toast.LENGTH_LONG).show();  
64.             break;  
65.         case MENU_PASTE:  
66.             Toast.makeText(this, "Paste", Toast.LENGTH_LONG).show();  
67.             break;  
68.         case MENU_SEARCH:  
69.             Toast.makeText(this, "Search", Toast.LENGTH_LONG).show();  
70.             break;  
71.         case MENU_FINISH_ACTIVITY:  
72.             Toast.makeText(this, "Finish Activity", Toast.LENGTH_LONG).show();  
73.             break;  
74.         case MENU_SHOW_COPY_DIALOG:  
75.             Toast.makeText(this, "Show Copy Dialog", Toast.LENGTH_LONG).show();  
76.             break;  
77.         case MENU_SETTING:  
78.             Toast.makeText(this, "Setting", Toast.LENGTH_LONG).show();  
79.             break;  
80.         case MENU_SET_VIEW_STYLE:  
81.             Toast.makeText(this, "Set View Style", Toast.LENGTH_LONG).show();  
82.             break;  
83.         default:  
84.             break;  
85.         }  
86.     }  
87.     @Override  
88.     public boolean dispatchKeyEvent(KeyEvent event) {  
89.         int actiton = event.getAction();  
90.         int code = event.getKeyCode();  
91.         switch (code) {  
92.         case KeyEvent.KEYCODE_MENU:  
93.             if (actiton == KeyEvent.ACTION_DOWN) {  
94.                 if (appMenu.getVisibility() == View.INVISIBLE) {  
95.                     showAppMenu();  
96.                 } else {  
97.                     hideAppMenu();  
98.                 }  
99.             }  
100.             break;  
101.         case KeyEvent.KEYCODE_BACK:  
102.             if (appMenu.getVisibility() == View.INVISIBLE) {  
103.                 hideAppMenu();  
104.             }  
105.             break;  
106.         default:  
107.             break;  
108.         }  
109.         return super.dispatchKeyEvent(event);  
110.     }  
111.     @Override  
112.     public boolean dispatchTouchEvent(MotionEvent event) {  
113.         if (appMenu.getVisibility() == View.VISIBLE) {  
114.             int y = (int) event.getRawY();  
115.             if (y < SCREEN_HEIGHT - appMenu.getHeight()) {  
116.                 hideAppMenu();  
117.                 return true;  
118.             }  
119.         }  
120.         return super.dispatchTouchEvent(event);  
121.     }  
122.     private void hideAppMenu() {  
123.         appMenu.setVisibility(View.INVISIBLE);  
124.         if (menuHideAnimation == null) {  
125.             menuHideAnimation = AnimationUtils.loadAnimation(this,  
126.                     R.anim.menuhide);  
127.         }  
128.         appMenu.startAnimation(menuHideAnimation);  
129.     }  
130.     private void showAppMenu() {  
131.         appMenu.setVisibility(View.VISIBLE);  
132.         if (menuShowAnimation == null) {  
133.             menuShowAnimation = AnimationUtils.loadAnimation(this,  
134.                     R.anim.menushow);  
135.         }  
136.         appMenu.startAnimation(menuShowAnimation);  
137.     }  
138. }  

 

res/anim中对于动画的控制：

menuhide.xml:

[xhtml]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <set xmlns:android="http://schemas.android.com/apk/res/android">  
3.     <translate  
4.         android:fromXDelta="0"  
5.         android:toXDelta="0"  
6.         android:fromYDelta="120"  
7.         android:toYDelta="00"  
8.         android:duration="200" />  
9. </set>  

 

menushow.xml:

[xhtml]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <set xmlns:android="http://schemas.android.com/apk/res/android">  
3.     <translate  
4.         android:fromXDelta="0"  
5.         android:toXDelta="0"  
6.         android:fromYDelta="00"  
7.         android:toYDelta="120"  
8.         android:duration="200" />  
9. </set>  

 

layout/main.xml:

[xhtml]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:orientation="vertical" android:layout_width="fill_parent"  
4.     android:layout_height="fill_parent">  
5.     <TextView android:layout_width="fill_parent"  
6.         android:layout_height="wrap_content" android:text="@string/hello" />  
7.     <LinearLayout android:id="@+id/appMenu" android:layout_gravity="bottom"  
8.         android:orientation="vertical" android:layout_width="fill_parent"  
9.         android:layout_height="125dip" android:visibility="visible"  
10.         android:background="@drawable/menubackground"   
11.         android:layout_alignParentBottom="true">  
12.         <LinearLayout android:id="@+id/appRow1"  
13.             android:orientation="horizontal" android:gravity="center_horizontal"  
14.             android:layout_gravity="center_horizontal" android:padding="2dip"  
15.             android:layout_width="fill_parent" android:layout_height="60dip">  
16.         </LinearLayout>  
17.         <LinearLayout android:id="@+id/appRow2"  
18.             android:orientation="horizontal" android:gravity="center_horizontal"  
19.             android:layout_gravity="center_horizontal" android:padding="2dip"  
20.             android:layout_width="fill_parent" android:layout_height="60dip">  
21.         </LinearLayout>  
22.     </LinearLayout>  
23. </RelativeLayout>  

 

layout/appmenuitem.xml:

[xhtml]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android"   
3.     android:layout_height="60dp"  
4.     android:layout_width="60dp"  
5.     android:gravity="center_horizontal">  
6.     <ImageButton android:id="@+id/menuicon"  
7.         android:layout_height="60dp" android:layout_width="60dp"  
8.         android:gravity="center_horizontal"   
9.         android:layout_alignParentBottom="true" />  
10.     <TextView android:id="@+id/menuname"  
11.         android:layout_height="60dp"  
12.         android:layout_width="60dp" android:singleLine="true"  
13.         android:textSize="12dp"  android:textColor="#ff000000"  
14.         android:paddingTop="40dp" android:gravity="center_horizontal"  
15.         android:layout_alignParentBottom="true" />  
16. </RelativeLayout>  

 

values/strings.xml:

[xhtml]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <resources>  
3.     <string name="hello">Hello World, PopMenu!</string>  
4.     <string name="app_name">PopMenu</string>  
5.     <string-array name="appnames">  
6.         <item>新建文件夹</item>  
7.         <item>新建文件</item>  
8.         <item>粘贴</item>  
9.         <item>搜索</item>  
10.         <item>复制对话框</item>  
11.         <item>APK管理</item>  
12.         <item>设置</item>  
13.         <item>图标</item>  
14.         <item>文件库</item>  
15.         <item>退出</item>  
16.     </string-array>  
17. </resources>  

 

做完这个感觉很多的动画效果都是“假的”，是做出来的一种效果。