天天看點

PopMenu效果的學習

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>  

做完這個感覺很多的動畫效果都是“假的”,是做出來的一種效果。