實現Android半透明Menu效果的開發實例

       不知道大家是否用過天天動聽，對於它界面上的半透明Menu效果，筆者感覺非常漂亮。下面是天天動聽半透明Menu的截圖，欣賞下吧：

       感覺還不錯吧？那麼如何實現這種半透明Menu效果呢？本文就重點討論並給出這種Menu的具體代碼實現過程。

       首先分析下實現這種半透明Menu所需做的工作，並進行合理分解：

       1.  利用Shaper設置一個半透明圓角背景。

       2.  定義Menu布局，主要就GridView，把圖標都放在這個GridView。

       3.  Menu事件, 通過PopupWindow或者AlertDialog或者透明Activity顯示到頁面即可。

       4.  按鈕的監聽事件，實例中沒加。需要的話自己在Adapter裡加。

       比較簡單，不多說了。

       半透明圓角背景xml：

1. <?xml version="1.0" encoding="UTF-8"?>  
2.   
3. <shape android:shape="rectangle">     
4.   
5.     <solid android:color="#b4000000" />  
6.   
7.     <stroke android:width="2.0dip" android:color="#b4ffffff" android:dashWidth="3.0dip" android:dashGap="0.0dip" />  
8.   
9.     <padding android:left="7.0dip" android:top="7.0dip" android:right="7.0dip" android:bottom="7.0dip" />  
10.   
11.     <corners android:radius="8.0dip" />  
12.   
13. </shape>  

        Menu布局：

1. <?xml version="1.0" encoding="UTF-8"?>  
2.   
3. <LinearLayout  
4.   
5.         android:orientation="vertical"  
6.   
7.         android:layout_width="wrap_content"  
8.   
9.         android:layout_height="fill_parent">  
10.        
11.   
12.         <GridView android:gravity="center"  
13.   
14.                 android:layout_gravity="center"  
15.   
16.                 android:id="@+id/menuGridChange"  
17.                
18.                 android:background="@drawable/menu_bg_frame"  
19.   
20.                 android:padding="5.0dip"  
21.   
22.                 android:layout_width="fill_parent"  
23.   
24.                 android:layout_height="wrap_content"  
25.   
26.                 android:horizontalSpacing="10.0dip"  
27.     
28.                 android:verticalSpacing="3.0dip"  
29.   
30.                 android:stretchMode="columnWidth"  
31.   
32.                 android:columnWidth="60.0dip"  
33.   
34.                 android:numColumns="auto_fit"/>  
35.   
36.                   
37. </LinearLayout>  

       主要類：

1. package com.yfz;   
2.   
3.   
4. import android.app.Activity;   
5. import android.app.AlertDialog;   
6. import android.app.AlertDialog.Builder;   
7. import android.content.Context;   
8. import android.graphics.drawable.BitmapDrawable;   
9. import android.os.Bundle;   
10. import android.util.Log;   
11. import android.view.ContextMenu;   
12. import android.view.Gravity;   
13. import android.view.LayoutInflater;   
14. import android.view.Menu;   
15. import android.view.MenuItem;   
16. import android.view.View;   
17. import android.view.ViewGroup;   
18. import android.view.ContextMenu.ContextMenuInfo;   
19. import android.widget.BaseAdapter;   
20. import android.widget.GridView;   
21. import android.widget.ImageView;   
22. import android.widget.LinearLayout;   
23. import android.widget.PopupWindow;   
24. import android.widget.TextView;   
25. import android.widget.LinearLayout.LayoutParams;   
26.   
27. public class MenuTest extends Activity {           
28.   
29.         private String TAG = this.getClass().getSimpleName();          
30.   
31.         private int[] resArray = new int[] {   
32.                 R.drawable.icon_menu_addto, R.drawable.icon_menu_audioinfo,   
33.                 R.drawable.icon_menu_findlrc, R.drawable.icon_menu_scan   
34.         };           
35.   
36.         private String[] title = new String[]{   
37.                 "添加歌曲", "歌曲信息", "查找歌詞", "搜索歌詞"  
38.         };           
39.   
40.         private static boolean show_flag = false;           
41.         private PopupWindow pw = null;           
42.   
43.         /** Called when the activity is first created. */  
44.         @Override  
45.         public void onCreate(Bundle savedInstanceState) {   
46.             super.onCreate(savedInstanceState);   
47.             setContentView(R.layout.main);   
48.         }   
49.   
50.         @Override  
51.   
52.         public boolean onCreateOptionsMenu(Menu menu) {   
53.                 Log.e(TAG, "------  onCreateOptionsMenu ------");   
54.                 //用AlertDialog彈出menu   
55.   
56. //                View view = LayoutInflater.from(this).inflate(R.layout.menu, null);   
57.   
58. //                GridView grid1 = (GridView)view.findViewById(R.id.menuGridChange);   
59.   
60. //                grid1.setAdapter(new ImageAdapter(this));   
61.   
62. //                Builder build = new AlertDialog.Builder(this);   
63.   
64. //                build.setView(view);   
65.   
66. //                build.show();   
67.                    
68.                 LayoutInflater inflater = (LayoutInflater)this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);         
69.   
70.                 View view = inflater.inflate(R.layout.menu, null);   
71.   
72.                 GridView grid1 = (GridView)view.findViewById(R.id.menuGridChange);   
73.   
74.                 grid1.setAdapter(new ImageAdapter(this));                   
75.   
76.                 //用Popupwindow彈出menu   
77.                 pw = new PopupWindow(view,LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);                   
78.   
79.                 //NND, 第一個參數， 必須找個View   
80.                 pw.showAtLocation(findViewById(R.id.tv), Gravity.CENTER, 0, 300);                   
81.   
82.                 return true;   
83.         }   
84.   
85.         @Override  
86.   
87.         public boolean onOptionsItemSelected(MenuItem item) {   
88.                 return super.onOptionsItemSelected(item);   
89.        }   
90.   
91.         public class ImageAdapter extends BaseAdapter {                   
92.                 private Context context;                   
93.   
94.                 public ImageAdapter(Context context) {   
95.                         this.context = context;   
96.                 }                   
97.   
98.                 @Override  
99.                 public int getCount() {   
100.                         return resArray.length;   
101.                 }   
102.   
103.                 @Override  
104.                 public Object getItem(int arg0) {   
105.                         return resArray[arg0];   
106.                 }   
107.   
108.                 @Override  
109.                 public long getItemId(int arg0) {   
110.                         return arg0;   
111.                 }   
112.   
113.                 @Override  
114.                 public View getView(int arg0, View arg1, ViewGroup arg2) {   
115.                         LinearLayout linear = new LinearLayout(context);   
116.   
117.                         LinearLayout.LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);   
118.   
119.                         linear.setOrientation(LinearLayout.VERTICAL);                           
120.   
121.                         ImageView iv = new ImageView(context);   
122.   
123.                         iv.setImageBitmap(((BitmapDrawable)context.getResources().getDrawable(resArray[arg0])).getBitmap());   
124.   
125.                         LinearLayout.LayoutParams params2 = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);   
126.   
127.                         params2.gravity=Gravity.CENTER;   
128.   
129.                         linear.addView(iv, params2);                           
130.   
131.                         TextView tv = new TextView(context);   
132.   
133.                         tv.setText(title[arg0]);   
134.   
135.                         LinearLayout.LayoutParams params3 = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);   
136.   
137.                         params3.gravity=Gravity.CENTER;                           
138.   
139.                         linear.addView(tv, params3);                           
140.                         return linear;   
141.                 }   
142.         }   
143. }  

        到此，大家是不是覺得半透明Menu效果也是比較好實現的呢？可以根據自己的需要對此實例進行修改以求更美觀好用。