首页 > 代码库 > android弹出窗口的实现(PopupWindow)

android弹出窗口的实现(PopupWindow)

android弹出窗口的实现(PopupWindow)              

       

           最近看到新浪微博顶部栏的微博分组效果很炫,从网上查了一些资料明白原来是用PopupWindow实现的,今天自己也写了一个例子实现了这种效果,希望对大家有帮助。

         PopupWindow就是弹出窗口的意思,类似windows下面的开始按钮。PopupWindow可以实现浮层效果,而且可以自定义显示位置,出现和退出时的动画.

            首先定义新浪微博的顶部栏,title_two_button.xml和main.xml

      

[html] view plaincopyprint?
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="wrap_content" >  
  5.   
  6.     <TextView  
  7.         android:id="@+id/tvtitle"  
  8.         android:layout_width="fill_parent"  
  9.         android:layout_height="45dip"  
  10.         android:background="@drawable/search_bg"  
  11.         android:gravity="center"  
  12.         android:text="天堂没有路"  
  13.         android:textColor="@color/black"  
  14.         android:textSize="25dip" />  
  15.   
  16.     <Button  
  17.         android:id="@+id/btn_title_left"  
  18.         android:layout_width="50dip"  
  19.         android:layout_height="35dip"  
  20.         android:layout_gravity="center_vertical"  
  21.         android:background="@drawable/title_button"  
  22.         android:textColor="@color/white" />  
  23.   
  24.     <Button  
  25.         android:id="@+id/btn_title_right"  
  26.         android:layout_width="50dip"  
  27.         android:layout_height="35dip"  
  28.         android:layout_gravity="right"  
  29.         android:layout_marginRight="2dip"  
  30.         android:layout_marginTop="4dip"  
  31.         android:background="@drawable/title_button2"  
  32.         android:textColor="@color/white" />  
  33.   
  34. </FrameLayout>  
<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="wrap_content" >    <TextView        android:id="@+id/tvtitle"        android:layout_width="fill_parent"        android:layout_height="45dip"        android:background="@drawable/search_bg"        android:gravity="center"        android:text="天堂没有路"        android:textColor="@color/black"        android:textSize="25dip" />    <Button        android:id="@+id/btn_title_left"        android:layout_width="50dip"        android:layout_height="35dip"        android:layout_gravity="center_vertical"        android:background="@drawable/title_button"        android:textColor="@color/white" />    <Button        android:id="@+id/btn_title_right"        android:layout_width="50dip"        android:layout_height="35dip"        android:layout_gravity="right"        android:layout_marginRight="2dip"        android:layout_marginTop="4dip"        android:background="@drawable/title_button2"        android:textColor="@color/white" /></FrameLayout>
[html] view plaincopyprint?
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:background="@android:color/white"  
  6.     android:orientation="vertical" >  
  7.   
  8.     <include  
  9.         android:id="@+id/top_title"  
  10.         layout="@layout/title_two_button" />  
  11.   
  12. </LinearLayout>  
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:background="@android:color/white"    android:orientation="vertical" >    <include        android:id="@+id/top_title"        layout="@layout/title_two_button" /></LinearLayout>
主要是为了实现一个这样的界面:

 

接下来定义弹出对话框的布局文件group_list.xml和group_item_view.xml

 

[html] view plaincopyprint?
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:background="@drawable/group_bg"  
  6.     android:orientation="vertical"  
  7.      >  
  8.   
  9.   
  10.     <ImageView  
  11.         android:id="@+id/iv_group_list_bg_divider"  
  12.         android:layout_width="fill_parent"  
  13.         android:layout_height="wrap_content"  
  14.         android:background="@drawable/group_divider"  
  15.          />  
  16.   
  17.     <ListView  
  18.         android:id="@+id/lvGroup"  
  19.         android:layout_width="fill_parent"  
  20.         android:layout_height="fill_parent"  
  21.         android:divider="@drawable/group_divider"  
  22.           />  
  23.   
  24. </LinearLayout>  
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:background="@drawable/group_bg"    android:orientation="vertical"     >    <ImageView        android:id="@+id/iv_group_list_bg_divider"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:background="@drawable/group_divider"         />    <ListView        android:id="@+id/lvGroup"        android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:divider="@drawable/group_divider"          /></LinearLayout>
[html] view plaincopyprint?
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="@dimen/group_item_height"  
  5.     android:orientation="vertical" >  
  6.   
  7.     <TextView  
  8.         android:id="@+id/groupItem"  
  9.        android:textColor="#ffffff"  
  10.        android:textSize="18dp"  
  11.         android:layout_width="fill_parent"  
  12.         android:layout_height="fill_parent"  
  13.         android:gravity="center" />  
  14.   
  15. </LinearLayout>  
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="@dimen/group_item_height"    android:orientation="vertical" >    <TextView        android:id="@+id/groupItem"       android:textColor="#ffffff"       android:textSize="18dp"        android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:gravity="center" /></LinearLayout>

 

 

自定义一个适配器:GroupAdapter

 

 

[html] view plaincopyprint?
  1. import java.util.List;  
  2.   
  3. import cn.com.karl.popwindow.R;  
  4.   
  5.   
  6. import android.content.Context;  
  7. import android.graphics.Color;  
  8. import android.view.LayoutInflater;  
  9. import android.view.View;  
  10. import android.view.ViewGroup;  
  11. import android.widget.BaseAdapter;  
  12. import android.widget.TextView;  
  13.   
  14. public class GroupAdapter extends BaseAdapter {  
  15.   
  16.     private Context context;  
  17.   
  18.     private List<String> list;  
  19.   
  20.     public GroupAdapter(Context context, List<String> list) {  
  21.   
  22.         this.context = context;  
  23.         this.list = list;  
  24.   
  25.     }  
  26.   
  27.     @Override  
  28.     public int getCount() {  
  29.         return list.size();  
  30.     }  
  31.   
  32.     @Override  
  33.     public Object getItem(int position) {  
  34.   
  35.         return list.get(position);  
  36.     }  
  37.   
  38.     @Override  
  39.     public long getItemId(int position) {  
  40.         return position;  
  41.     }  
  42.   
  43.     @Override  
  44.     public View getView(int position, View convertView, ViewGroup viewGroup) {  
  45.   
  46.           
  47.         ViewHolder holder;  
  48.         if (convertView==null) {  
  49.             convertView=LayoutInflater.from(context).inflate(R.layout.group_item_view, null);  
  50.             holder=new ViewHolder();  
  51.               
  52.             convertView.setTag(holder);  
  53.               
  54.             holder.groupItem=(TextView) convertView.findViewById(R.id.groupItem);  
  55.               
  56.         }  
  57.         else{  
  58.             holder=(ViewHolder) convertView.getTag();  
  59.         }  
  60.         holder.groupItem.setTextColor(Color.BLACK);  
  61.         holder.groupItem.setText(list.get(position));  
  62.           
  63.         return convertView;  
  64.     }  
  65.   
  66.     static class ViewHolder {  
  67.         TextView groupItem;  
  68.     }  
  69.   
  70. }  
import java.util.List;import cn.com.karl.popwindow.R;import android.content.Context;import android.graphics.Color;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.TextView;public class GroupAdapter extends BaseAdapter {	private Context context;	private List<String> list;	public GroupAdapter(Context context, List<String> list) {		this.context = context;		this.list = list;	}	@Override	public int getCount() {		return list.size();	}	@Override	public Object getItem(int position) {		return list.get(position);	}	@Override	public long getItemId(int position) {		return position;	}	@Override	public View getView(int position, View convertView, ViewGroup viewGroup) {				ViewHolder holder;		if (convertView==null) {			convertView=LayoutInflater.from(context).inflate(R.layout.group_item_view, null);			holder=new ViewHolder();						convertView.setTag(holder);						holder.groupItem=(TextView) convertView.findViewById(R.id.groupItem);					}		else{			holder=(ViewHolder) convertView.getTag();		}		holder.groupItem.setTextColor(Color.BLACK);		holder.groupItem.setText(list.get(position));				return convertView;	}	static class ViewHolder {		TextView groupItem;	}}

最后是我要实现弹出对话框的核心类PoupWindowDemoActivity

 

 

 

[html] view plaincopyprint?
  1. import java.util.ArrayList;  
  2. import java.util.List;  
  3.   
  4.   
  5. import cn.com.karl.adapter.GroupAdapter;  
  6.   
  7. import android.app.Activity;  
  8. import android.content.Context;  
  9. import android.graphics.drawable.BitmapDrawable;  
  10. import android.os.Bundle;  
  11. import android.util.Log;  
  12. import android.view.LayoutInflater;  
  13. import android.view.View;  
  14. import android.view.Window;  
  15. import android.view.WindowManager;  
  16. import android.widget.AdapterView;  
  17. import android.widget.AdapterView.OnItemClickListener;  
  18. import android.widget.ListView;  
  19. import android.widget.PopupWindow;  
  20. import android.widget.TextView;  
  21. import android.widget.Toast;  
  22.   
  23. public class PoupWindowDemoActivity extends Activity {  
  24.   
  25.     private PopupWindow popupWindow;  
  26.   
  27.     private ListView lv_group;  
  28.   
  29.     private View view;  
  30.   
  31.     private View top_title;  
  32.   
  33.     private TextView tvtitle;  
  34.   
  35.     private List<String> groups;  
  36.   
  37.     public void onCreate(Bundle savedInstanceState) {  
  38.         super.onCreate(savedInstanceState);  
  39.         this.requestWindowFeature(Window.FEATURE_NO_TITLE);  
  40.         setContentView(R.layout.main);  
  41.   
  42.         top_title = this.findViewById(R.id.top_title);  
  43.   
  44.         tvtitle = (TextView) top_title.findViewById(R.id.tvtitle);  
  45.   
  46.         tvtitle.setText("天堂没有路");  
  47.   
  48.         tvtitle.setOnClickListener(new View.OnClickListener() {  
  49.   
  50.             @Override  
  51.             public void onClick(View v) {  
  52.                 showWindow(v);  
  53.             }  
  54.         });  
  55.   
  56.     }  
  57.   
  58.       
  59.     private void showWindow(View parent) {  
  60.   
  61.         if (popupWindow == null) {  
  62.             LayoutInflater layoutInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);  
  63.   
  64.             view = layoutInflater.inflate(R.layout.group_list, null);  
  65.   
  66.             lv_group = (ListView) view.findViewById(R.id.lvGroup);  
  67.             // 加载数据  
  68.             groups = new ArrayList<String>();  
  69.             groups.add("全部");  
  70.             groups.add("我的微博");  
  71.             groups.add("好友");  
  72.             groups.add("亲人");  
  73.             groups.add("同学");  
  74.             groups.add("朋友");  
  75.             groups.add("陌生人");  
  76.   
  77.             GroupAdapter groupAdapter = new GroupAdapter(this, groups);  
  78.             lv_group.setAdapter(groupAdapter);  
  79.             // 创建一个PopuWidow对象  
  80.             popupWindow = new PopupWindow(view, 300, 350);  
  81.         }  
  82.   
  83.         // 使其聚集  
  84.         popupWindow.setFocusable(true);  
  85.         // 设置允许在外点击消失  
  86.         popupWindow.setOutsideTouchable(true);  
  87.   
  88.         // 这个是为了点击“返回Back”也能使其消失,并且并不会影响你的背景  
  89.         popupWindow.setBackgroundDrawable(new BitmapDrawable());  
  90.         WindowManager windowManager = (WindowManager) getSystemService(Context.WINDOW_SERVICE);  
  91.         // 显示的位置为:屏幕的宽度的一半-PopupWindow的高度的一半  
  92.         int xPos = windowManager.getDefaultDisplay().getWidth() / 2  
  93.                 - popupWindow.getWidth() / 2;  
  94.         Log.i("coder", "xPos:" + xPos);  
  95.   
  96.         popupWindow.showAsDropDown(parent, xPos, 0);  
  97.   
  98.         lv_group.setOnItemClickListener(new OnItemClickListener() {  
  99.   
  100.             @Override  
  101.             public void onItemClick(AdapterView<?> adapterView, View view,  
  102.                     int position, long id) {  
  103.   
  104.                 Toast.makeText(PoupWindowDemoActivity.this,  
  105.                         groups.get(position), 1000)  
  106.                         .show();  
  107.   
  108.                 if (popupWindow != null) {  
  109.                     popupWindow.dismiss();  
  110.                 }  
  111.             }  
  112.         });  
  113.     }  
  114. }  
import java.util.ArrayList;import java.util.List;import cn.com.karl.adapter.GroupAdapter;import android.app.Activity;import android.content.Context;import android.graphics.drawable.BitmapDrawable;import android.os.Bundle;import android.util.Log;import android.view.LayoutInflater;import android.view.View;import android.view.Window;import android.view.WindowManager;import android.widget.AdapterView;import android.widget.AdapterView.OnItemClickListener;import android.widget.ListView;import android.widget.PopupWindow;import android.widget.TextView;import android.widget.Toast;public class PoupWindowDemoActivity extends Activity {	private PopupWindow popupWindow;	private ListView lv_group;	private View view;	private View top_title;	private TextView tvtitle;	private List<String> groups;	public void onCreate(Bundle savedInstanceState) {		super.onCreate(savedInstanceState);		this.requestWindowFeature(Window.FEATURE_NO_TITLE);		setContentView(R.layout.main);		top_title = this.findViewById(R.id.top_title);		tvtitle = (TextView) top_title.findViewById(R.id.tvtitle);		tvtitle.setText("天堂没有路");		tvtitle.setOnClickListener(new View.OnClickListener() {			@Override			public void onClick(View v) {				showWindow(v);			}		});	}		private void showWindow(View parent) {		if (popupWindow == null) {			LayoutInflater layoutInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);			view = layoutInflater.inflate(R.layout.group_list, null);			lv_group = (ListView) view.findViewById(R.id.lvGroup);			// 加载数据			groups = new ArrayList<String>();			groups.add("全部");			groups.add("我的微博");			groups.add("好友");			groups.add("亲人");			groups.add("同学");			groups.add("朋友");			groups.add("陌生人");			GroupAdapter groupAdapter = new GroupAdapter(this, groups);			lv_group.setAdapter(groupAdapter);			// 创建一个PopuWidow对象			popupWindow = new PopupWindow(view, 300, 350);		}		// 使其聚集		popupWindow.setFocusable(true);		// 设置允许在外点击消失		popupWindow.setOutsideTouchable(true);		// 这个是为了点击“返回Back”也能使其消失,并且并不会影响你的背景		popupWindow.setBackgroundDrawable(new BitmapDrawable());		WindowManager windowManager = (WindowManager) getSystemService(Context.WINDOW_SERVICE);		// 显示的位置为:屏幕的宽度的一半-PopupWindow的高度的一半		int xPos = windowManager.getDefaultDisplay().getWidth() / 2				- popupWindow.getWidth() / 2;		Log.i("coder", "xPos:" + xPos);		popupWindow.showAsDropDown(parent, xPos, 0);		lv_group.setOnItemClickListener(new OnItemClickListener() {			@Override			public void onItemClick(AdapterView<?> adapterView, View view,					int position, long id) {				Toast.makeText(PoupWindowDemoActivity.this,						groups.get(position), 1000)						.show();				if (popupWindow != null) {					popupWindow.dismiss();				}			}		});	}}

这样就完成了一个弹出对话框的效果,下面来看一下吧!

 

 

再看一张新浪微博的弹出对话框效果:

已经完成,我们可以把这项功能加入自己的做的新浪微博里,为自己的应用增添点特色色彩吧!

android弹出窗口的实现(PopupWindow)