实现Android半透明Menu效果的开发实例

不知道大家是否用过天天动听，对于它界面上的半透明Menu效果，笔者感觉非常漂亮。下面是天天动听半透明Menu的截图，欣赏下吧：

感觉还不错吧？那么如何实现这种半透明Menu效果呢？本文就重点讨论并给出这种Menu的具体代码实现过程。

首先分析下实现这种半透明Menu所需做的工作，并进行合理分解：

1.  利用Shaper设置一个半透明圆角背景。

2.  定义Menu布局，主要就GridView，把图标都放在这个GridView。

3.  Menu事件, 通过PopupWindow或者AlertDialog或者透明Activity显示到页面即可。

4.  按钮的监听事件，实例中没加。需要的话自己在Adapter里加。

比较简单，不多说了。

半透明圆角背景xml：

XML/HTML代码

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

Menu布局：

XML/HTML代码

1. <?xml version="1.0" encoding="UTF-8"?>
2. <LinearLayout
3. android:orientation="vertical"
4. android:layout_width="wrap_content"
5. android:layout_height="fill_parent">
6. <GridView android:gravity="center"
7. android:layout_gravity="center"
8. android:id="@+id/menuGridChange"
9. android:background="@drawable/menu_bg_frame"
10. android:padding="5.0dip"
11. android:layout_width="fill_parent"
12. android:layout_height="wrap_content"
13. android:horizontalSpacing="10.0dip"
14. android:verticalSpacing="3.0dip"
15. android:stretchMode="columnWidth"
16. android:columnWidth="60.0dip"
17. android:numColumns="auto_fit"/>
18. </LinearLayout>

主要类：

Java代码

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

到此，大家是不是觉得半透明Menu效果也是比较好实现的呢？可以根据自己的需要对此实例进行修改以求更美观好用。