Android仿微信下拉列表实现(附源码)

 本文要实现微信6.1中点击顶部菜单栏的“+”号按钮时，会弹出一个列表框。这里用的了Activity实现，其实最好的方法可以用ActionBar,不过这货好像只支持3.0以后的版本。本文的接上文Android仿微信底部菜单栏+顶部菜单栏（附源码）

效果：源码免费下载

一、仿微信下拉列表布局pop_dialog.xml

[html] view plaincopy

1. <?xml version="1.0" encoding="UTF-8"?>  
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="wrap_content"  
4.     android:layout_height="wrap_content" >  
5.    
6.     <RelativeLayout  
7.         android:layout_width="fill_parent"  
8.         android:layout_height="fill_parent"  
9.         android:layout_marginTop="45dp"  
10.         android:layout_marginRight="20dp">  
11.   
12.         <LinearLayout  
13.             android:id="@+id/id_pop_dialog_layout"  
14.             android:layout_width="wrap_content"  
15.             android:layout_height="wrap_content"  
16.             android:layout_alignParentRight="true"  
17.             android:layout_alignParentTop="true"  
18.             android:background="@drawable/pop_item_normal"  
19.             android:orientation="vertical" >  
20.   
21.             <LinearLayout  
22.                 android:id="@+id/id_groupchat"  
23.                 android:layout_width="fill_parent"  
24.                 android:layout_height="wrap_content"  
25.                 android:layout_marginLeft="5dp"  
26.                 android:layout_marginRight="5dp"  
27.                 android:layout_marginTop="5dp"  
28.                 android:background="@drawable/pop_list_selector" >  
29.   
30.                 <ImageView  
31.                     android:id="@+id/id_imageView1"  
32.                     android:layout_width="wrap_content"  
33.                     android:layout_height="wrap_content"  
34.                     android:layout_gravity="center_vertical"  
35.                     android:layout_marginLeft="8dp"  
36.                     android:src="@drawable/pop_group" />  
37.   
38.                 <TextView  
39.                     android:layout_width="wrap_content"  
40.                     android:layout_height="wrap_content"  
41.                     android:padding="8dp"  
42.                     android:text="发起聊天"  
43.                      android:layout_gravity="center_vertical"  
44.                     android:textColor="#fff"  
45.                     android:textSize="16sp" />  
46.             </LinearLayout>  
47.   
48.             <ImageView  
49.                 android:id="@+id/id_imageView5"  
50.                 android:layout_width="wrap_content"  
51.                 android:layout_height="wrap_content"  
52.                 android:src="@drawable/pop_line" />  
53.   
54.             <LinearLayout  
55.                 android:id="@+id/id_addfrd"  
56.                 android:layout_width="fill_parent"  
57.                 android:layout_height="wrap_content"  
58.                 android:layout_marginLeft="5dp"  
59.                 android:layout_marginRight="5dp"  
60.                 android:background="@drawable/pop_list_selector" >  
61.   
62.                 <ImageView  
63.                     android:id="@+id/id_imageView2"  
64.                     android:layout_width="wrap_content"  
65.                     android:layout_height="wrap_content"  
66.                     android:layout_gravity="center_vertical"  
67.                     android:layout_marginLeft="8dp"  
68.                     android:src="@drawable/pop_add" />  
69.   
70.                 <TextView  
71.                     android:layout_width="wrap_content"  
72.                     android:layout_height="wrap_content"  
73.                     android:padding="8dp"  
74.                     android:text="添加朋友"  
75.                       android:layout_gravity="center_vertical"  
76.                     android:textColor="#fff"  
77.                     android:textSize="16sp" />  
78.             </LinearLayout>  
79.   
80.             <ImageView  
81.                 android:id="@+id/id_imageView5"  
82.                 android:layout_width="wrap_content"  
83.                 android:layout_height="wrap_content"  
84.                 android:src="@drawable/pop_line" />  
85.   
86.             <LinearLayout  
87.                 android:id="@+id/id_find"  
88.                 android:layout_width="fill_parent"  
89.                 android:layout_height="wrap_content"  
90.                 android:layout_marginLeft="5dp"  
91.                 android:layout_marginRight="5dp"  
92.                 android:background="@drawable/pop_list_selector" >  
93.   
94.                 <ImageView  
95.                     android:id="@+id/id_imageView3"  
96.                     android:layout_width="wrap_content"  
97.                     android:layout_height="wrap_content"  
98.                     android:layout_gravity="center_vertical"  
99.                     android:layout_marginLeft="8dp"  
100.                     android:src="@drawable/pop_qrcode" />  
101.   
102.                 <TextView  
103.                     android:layout_width="wrap_content"  
104.                     android:layout_height="wrap_content"  
105.                     android:padding="8dp"  
106.                     android:text="扫一扫"  
107.                   android:layout_gravity="center_vertical"  
108.                     android:textColor="#fff"  
109.                     android:textSize="16sp" />  
110.             </LinearLayout>  
111.   
112.             <ImageView  
113.                 android:id="@+id/id_imageView5"  
114.                 android:layout_width="wrap_content"  
115.                 android:layout_height="wrap_content"  
116.                 android:src="@drawable/pop_line" />  
117.   
118.             <LinearLayout  
119.                 android:id="@+id/id_feedback"  
120.                 android:layout_width="fill_parent"  
121.                 android:layout_height="wrap_content"  
122.                 android:layout_marginBottom="3dp"  
123.                 android:layout_marginLeft="5dp"  
124.                 android:layout_marginRight="5dp"  
125.                 android:background="@drawable/pop_list_selector" >  
126.   
127.                 <ImageView  
128.                     android:id="@+id/id_imageView4"  
129.                     android:layout_width="wrap_content"  
130.                     android:layout_height="wrap_content"  
131.                     android:layout_gravity="center_vertical"  
132.                     android:layout_marginLeft="8dp"  
133.                     android:src="@drawable/pop_feedback" />  
134.   
135.                 <TextView  
136.                     android:layout_width="wrap_content"  
137.                     android:layout_height="wrap_content"  
138.                     android:padding="8dp"  
139.                     android:text="帮助与反馈"  
140.                    android:layout_gravity="center_vertical"  
141.                     android:textColor="#fff"  
142.                     android:textSize="16sp" />  
143.             </LinearLayout>  
144.         </LinearLayout>  
145.     </RelativeLayout>  
146.   
147. </RelativeLayout>  

其中，按下图片后变换颜色：

[html] view plaincopy

1. android:background="@drawable/pop_list_selector" >  

pop_list_selector.xml如下

[html] view plaincopy

1. <?xml version="1.0" encoding="UTF-8"?>  
2. <selector xmlns:android="http://schemas.android.com/apk/res/android">  
3.   
4.     <item android:drawable="@drawable/pop_item_pressed" android:state_focused="true"/>  
5.     <item android:drawable="@drawable/pop_item_pressed" android:state_pressed="true"/>  
6.     <item android:drawable="@drawable/pop_item_pressed" android:state_selected="true"/>  
7.     <item android:drawable="@drawable/pop_item_normal"/>  
8.   
9. </selector>  

看看效果，这是去掉标题栏后的（也可以用代码去掉）

去掉标题栏的方法：

二、对应代码

pop_dialog.xml对应的代码为PopDialogActivity.java

如下：

[java] view plaincopy

1. /** 
2.  * @作者 林炳文（邮箱：[e-mail]） 
3.  * @博客 http://blog.csdn.net/evankaka/ 
4.  * @功能描述：弹出微信下拉列表框 
5.  */  
6. package com.example.tabexample;  
7. import android.app.Activity;  
8. import android.os.Bundle;  
9. import android.view.MotionEvent;  
10. import android.view.View;  
11. import android.view.Window;  
12. import android.view.View.OnClickListener;  
13. import android.widget.LinearLayout;  
14.   
15. public class PopDialogActivity extends Activity implements OnClickListener{  
16.     //定义四个按钮区域  
17.     private LinearLayout mGroupChat;  
18.     private LinearLayout mAddFrd;  
19.     private LinearLayout mFind;  
20.     private LinearLayout mFeedBack;  
21.       
22.     @Override  
23.     protected void onCreate(Bundle savedInstanceState) {  
24.         super.onCreate(savedInstanceState);  
25.         requestWindowFeature(Window.FEATURE_NO_TITLE);  
26.         setContentView(R.layout.pop_dialog);  
27.   
28.         initView();  
29.     }  
30.   
31.     /** 
32.      * 初始化组件 
33.      */  
34.     private void initView(){  
35.         //得到布局组件对象并设置监听事件  
36.         mGroupChat = (LinearLayout)findViewById(R.id.id_groupchat);  
37.         mAddFrd = (LinearLayout)findViewById(R.id.id_addfrd);  
38.         mFind = (LinearLayout)findViewById(R.id.id_find);  
39.         mFeedBack = (LinearLayout)findViewById(R.id.id_feedback);  
40.   
41.         mGroupChat.setOnClickListener(this);  
42.         mAddFrd.setOnClickListener(this);  
43.         mFind.setOnClickListener(this);  
44.         mFeedBack.setOnClickListener(this);  
45.     }  
46.       
47.     @Override  
48.     public boolean onTouchEvent(MotionEvent event){  
49.         finish();  
50.         return true;  
51.     }  
52.       
53.     @Override  
54.     public void onClick(View v) {  
55.           
56.     }  
57. }  

三、设置背景透明

     如果单这样，当这个Activity出来后，就会把之前的Activity覆盖，但是如果把它背景设置成透明的不就可以了么？方法如下：

在AndroidManifest.xml中添加：

[html] view plaincopy

1. <!-- 这里一定要注册上这个activity，否则跳转将会失败，因为系统找不到这个activity -->  
2. t;activity  
3.   android:name="com.example.tabexample.PopDialogActivity"  
4.   android:label="@string/app_name"   
5.   android:theme="@style/MyDialogStyleTop">  
6. t;/activity>  

其中

[html] view plaincopy

1. "@style/MyDialogStyleTop"  

是我自己定义的格式，在value/style下添加：

[html] view plaincopy

1. <style name="MyDialogStyleTop" parent="android:Theme.Dialog">  
2.     <item name="android:windowFrame">@null</item><!-- 边框 -->  
3.     <item name="android:windowIsFloating">true</item> <!-- 是否浮现在activity之上 -->  
4.     <item name="android:windowIsTranslucent">false</item><!-- 半透明 -->  
5.     <item name="android:windowNoTitle">true</item> <!-- 无标题 -->  
6.     <item name="android:windowBackground">@android:color/transparent</item><!-- 背景透明 -->  
7.     <item name="android:backgroundDimEnabled">false</item><!-- 模糊 -->  
8. </style>  

四、使用

    其实使用就是Activity的跳转了，方法很简单，一句：

[java] view plaincopy

1. startActivity(new Intent(MainActivity.this,PopDialogActivity.class));  

把这句放在“+”按钮的点击事件当中去，这里添加点击事件就不用说了，很简单，然后最终的效果如下：

                                                                                                

转 载 出 处:http://blog.csdn.net/evankaka