思享工具箱

Android-自己定义PopupWindow

摘要：
//schemas.android.com/apk/res/android“android:layout_height=”wrap_content“android:layout_width=”wrap _content”android:layout_marginLeft=“10dip”android:布局_宽度=“wrap_con tent”android：
Android-自己定义PopupWindow

2014年5月12日
PopupWindow在应用中应该是随处可见的，非经常常使用到，比方在旧版本号的微信其中就用到下拉的PopupWindow。那是自己定义的。新版微信5.2的ActionBar，有人已经模仿了它，但微信详细是使用了ActionBar还是其它的笔者倒是不太清楚。本篇博客主要介绍怎样自己定义一个PopupWindow来供自己在开发应用时使用。

由于笔者近期在开发一款应用时用到这个知识点，所以自己实现了相似新版微信的效果。

效果图例如以下：
Android-自己定义PopupWindow第1张

Android-自己定义PopupWindow第2张



首先从布局開始
/14_CustomPopupWindow/res/layout/activity_swipe.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android: 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clickable="true"
    android:orientation="vertical" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/abc_ab_bottom_solid_dark_holo"
        android:padding="12dip" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:gravity="center"
            android:orientation="horizontal" >

            <ImageView
                android:layout_width="30dp"
                android:layout_height="30dp"
                android:src="http://t.zoukankan.com/@drawable/ic_launcher" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dip"
                android:text="任务系统"
                android:textColor="@color/lightgray"
                android:textSize="18sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:gravity="center"
            android:orientation="horizontal" >

            <Button
                android: 
                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_marginRight="20dip"
                android:background="@drawable/actionbar_search_icon"
                android:visibility="gone" />

            <Button
                android: 
                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_marginRight="20dip"
                android:background="@drawable/actionbar_add_icon" />

            <Button
                android: 
                android:layout_width="30dp"
                android:layout_height="30dp"
                android:background="@drawable/actionbar_more_icon" />
        </LinearLayout>
    </RelativeLayout>


</LinearLayout>

/14_CustomPopupWindow/res/layout/add_popup_dialog.xml
<?
xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <LinearLayout
        android: 
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:background="@drawable/abc_ab_bottom_solid_dark_holo"
        android:gravity="center_horizontal"
        android:orientation="vertical" >

        <LinearLayout
            android: 
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="8dp" >

            <ImageView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:scaleType="fitCenter"
                android:src="http://t.zoukankan.com/@drawable/ofm_add_icon" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_marginLeft="10dp"
                android:gravity="center"
                android:text="加入任务"
                android:textColor="@color/white"
                android:textSize="15dip" />
        </LinearLayout>

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="0.2dp"
            android:background="@color/black" />

        <LinearLayout
            android: 
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="8dp" >

            <ImageView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:scaleType="fitCenter"
                android:src="http://t.zoukankan.com/@drawable/ofm_profile_icon" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_marginLeft="10dp"
                android:gravity="center"
                android:text="团队成员"
                android:textColor="@color/white"
                android:textSize="15dip" />
        </LinearLayout>

    </LinearLayout>

</RelativeLayout>



/14_CustomPopupWindow/res/layout/more_popup_dialog.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <LinearLayout
        android: 
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:background="@drawable/abc_ab_bottom_solid_dark_holo"
        android:gravity="center_horizontal"
        android:orientation="vertical" >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="8dp" >

            <ImageView
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:src="http://t.zoukankan.com/@drawable/defalt_head" />

            <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:gravity="left|center_horizontal"
                android:orientation="vertical"
                android:padding="5dp" >

                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="wwj"
                    android:textColor="@color/white"
                    android:textSize="15sp" />

                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="whatswwj"
                    android:textColor="@color/green"
                    android:textSize="15sp" />
            </LinearLayout>
        </LinearLayout>

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="0.2dp"
            android:background="@color/black" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="8dp" >

            <ImageView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:scaleType="fitCenter"
                android:src="http://t.zoukankan.com/@drawable/ofm_photo_icon" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_marginLeft="10dp"
                android:gravity="center"
                android:text="我的相冊"
                android:textColor="@color/white"
                android:textSize="15sp" />
        </LinearLayout>

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="0.2dp"
            android:background="@color/black" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="8dp"
            android:visibility="gone" >

            <ImageView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:scaleType="fitCenter"
                android:src="http://t.zoukankan.com/@drawable/ofm_collect_icon" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_marginLeft="10dp"
                android:gravity="center"
                android:text="我的收藏"
                android:textColor="@color/white"
                android:textSize="15sp" />
        </LinearLayout>

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="0.2dp"
            android:background="@color/black" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="8dp"
            android:visibility="gone" >

            <ImageView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:scaleType="fitCenter"
                android:src="http://t.zoukankan.com/@drawable/ofm_card_icon" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_marginLeft="10dp"
                android:gravity="center"
                android:text="我的银行卡"
                android:textColor="@color/white"
                android:textSize="15sp" />
        </LinearLayout>

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="0.2dp"
            android:background="@color/black"
            android:visibility="gone" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="8dp" >

            <ImageView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:scaleType="fitCenter"
                android:src="http://t.zoukankan.com/@drawable/ofm_setting_icon" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_marginLeft="10dp"
                android:gravity="center"
                android:text="设置"
                android:textColor="@color/white"
                android:textSize="15sp" />
        </LinearLayout>

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="0.2dp"
            android:background="@color/black" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="8dp" >

            <ImageView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:scaleType="fitCenter"
                android:src="http://t.zoukankan.com/@drawable/ofm_blacklist_icon" />

            <Button
                android: 
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_marginLeft="10dp"
                android:background="@null"
                android:gravity="center"
                android:text="退出登录"
                android:textColor="@color/white"
                android:textSize="15sp" />
        </LinearLayout>
    </LinearLayout>

</RelativeLayout>

以上各自是主页面和两个popupWindow布局

以下自己定义两个PopupWindow，自己封装自己想要的PopuoWindow。这里仅仅是给出演示样例


/14_CustomPopupWindow/src/com/wwj/popupwindow/AddPopWindow.java
package com.wwj.popupwindow;

import android.app.Activity;
import android.content.Context;
import android.graphics.drawable.ColorDrawable;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup.LayoutParams;
import android.widget.LinearLayout;
import android.widget.PopupWindow;

/**
 * 自己定义popupWindow
 * 
 * @author wwj
 * 
 * 
 */
public class AddPopWindow extends PopupWindow {
	private View conentView;

	public AddPopWindow(final Activity context) {
		LayoutInflater inflater = (LayoutInflater) context
				.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
		conentView = inflater.inflate(R.layout.add_popup_dialog, null);
		int h = context.getWindowManager().getDefaultDisplay().getHeight();
		int w = context.getWindowManager().getDefaultDisplay().getWidth();
		// 设置SelectPicPopupWindow的View
		this.setContentView(conentView);
		// 设置SelectPicPopupWindow弹出窗口的宽
		this.setWidth(w / 2 + 50);
		// 设置SelectPicPopupWindow弹出窗口的高
		this.setHeight(LayoutParams.WRAP_CONTENT);
		// 设置SelectPicPopupWindow弹出窗口可点击
		this.setFocusable(true);
		this.setOutsideTouchable(true);
		// 刷新状态
		this.update();
		// 实例化一个ColorDrawable颜色为半透明
		ColorDrawable dw = new ColorDrawable(0000000000);
		// 点back键和其它地方使其消失,设置了这个才干触发OnDismisslistener ，设置其它控件变化等操作
		this.setBackgroundDrawable(dw);
		// mPopupWindow.setAnimationStyle(android.R.style.Animation_Dialog);
		// 设置SelectPicPopupWindow弹出窗口动画效果
		this.setAnimationStyle(R.style.AnimationPreview);
		LinearLayout addTaskLayout = (LinearLayout) conentView
				.findViewById(R.id.add_task_layout);
		LinearLayout teamMemberLayout = (LinearLayout) conentView
				.findViewById(R.id.team_member_layout);
		addTaskLayout.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View arg0) {
				AddPopWindow.this.dismiss();
			}
		});

		teamMemberLayout.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View v) {
				AddPopWindow.this.dismiss();
			}
		});
	}

	/**
	 * 显示popupWindow
	 * 
	 * @param parent
	 */
	public void showPopupWindow(View parent) {
		if (!this.isShowing()) {
			// 以下拉方式显示popupwindow
			this.showAsDropDown(parent, parent.getLayoutParams().width / 2, 18);
		} else {
			this.dismiss();
		}
	}
}


/14_CustomPopupWindow/src/com/wwj/popupwindow/MorePopWindow.java
package com.wwj.popupwindow;

import android.app.Activity;
import android.content.Context;
import android.graphics.drawable.ColorDrawable;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup.LayoutParams;
import android.widget.PopupWindow;

public class MorePopWindow extends PopupWindow {
	private View conentView;

	public MorePopWindow(final Activity context) {
		LayoutInflater inflater = (LayoutInflater) context
				.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
		conentView = inflater.inflate(R.layout.more_popup_dialog, null);
		int h = context.getWindowManager().getDefaultDisplay().getHeight();
		int w = context.getWindowManager().getDefaultDisplay().getWidth();
		// 设置SelectPicPopupWindow的View
		this.setContentView(conentView);
		// 设置SelectPicPopupWindow弹出窗口的宽
		this.setWidth(w / 2 + 50);
		// 设置SelectPicPopupWindow弹出窗口的高
		this.setHeight(LayoutParams.WRAP_CONTENT);
		// 设置SelectPicPopupWindow弹出窗口可点击
		this.setFocusable(true);
		this.setOutsideTouchable(true);
		// 刷新状态
		this.update();
		// 实例化一个ColorDrawable颜色为半透明
		ColorDrawable dw = new ColorDrawable(0000000000);
		// 点back键和其它地方使其消失,设置了这个才干触发OnDismisslistener 。设置其它控件变化等操作
		this.setBackgroundDrawable(dw);
		// mPopupWindow.setAnimationStyle(android.R.style.Animation_Dialog);
		// 设置SelectPicPopupWindow弹出窗口动画效果
		this.setAnimationStyle(R.style.AnimationPreview);

	}

	public void showPopupWindow(View parent) {
		if (!this.isShowing()) {
			this.showAsDropDown(parent, parent.getLayoutParams().width / 2, 18);
		} else {
			this.dismiss();
		}
	}
}


上面用到一个动画样式效果：
/14_CustomPopupWindow/res/values/styles.xml
 <style name="AnimationPreview">
        <item name="android:windowEnterAnimation">@anim/fade_in</item>
        <item name="android:windowExitAnimation">@anim/fade_out</item>
    </style>

用到两个动画资源
/14_CustomPopupWindow/res/anim/fade_in.xml
<?
xml version="1.0" encoding="utf-8"?>
<!-- 左上角扩大-->
  <scale   xmlns:android="http://schemas.android.com/apk/res/android"
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"  
        android:fromXScale="0.001" 
        android:toXScale="1.0"   
        android:fromYScale="0.001"   
        android:toYScale="1.0"   
        android:pivotX="100%"  
        android:pivotY="10%"  
        android:duration="200" />

/14_CustomPopupWindow/res/anim/fade_out.xml
<?xml version="1.0" encoding="utf-8"?
>
<!-- 左上角缩小 -->
  <scale   xmlns:android="http://schemas.android.com/apk/res/android"
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"  
        android:fromXScale="1.0"   
        android:toXScale="0.001"   
        android:fromYScale="1.0"   
        android:toYScale="0.001"   
        android:pivotX="100%"  
        android:pivotY="10%" 
        android:duration="200" />






/14_CustomPopupWindow/src/com/wwj/popupwindow/MainActivity.java
package com.wwj.popupwindow;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;

public class MainActivity extends Activity implements OnClickListener{
	private Button setButton;
	private Button addButton;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_swipe);
		
		setButton = (Button) findViewById(R.id.btnSet);
		addButton = (Button) findViewById(R.id.btnAdd);
		setButton.setOnClickListener(this);
		addButton.setOnClickListener(this);;
	}
	
	@Override
	public void onClick(View v) {
		switch (v.getId()) {
		case R.id.btnSet:
			MorePopWindow morePopWindow = new MorePopWindow(MainActivity.this);
			morePopWindow.showPopupWindow(setButton);
			break;
		case R.id.btnSearch:
			
			break;
		case R.id.btnAdd:
			AddPopWindow addPopWindow = new AddPopWindow(MainActivity.this);
			addPopWindow.showPopupWindow(addButton);
			break;
		default:
			break;
		}
	}
}

以上是代码实现。详细能够下载源代码參考。






标签：#android#lt#layout#:#amp#gt | 浏览：106 | 发布日期：

免责声明：文章转载自《Android-自己定义PopupWindow》仅用于学习参考。如对内容有疑问，请及时联系本站处理。

上篇（转）透明光照模型与环境贴图之基础理论篇（折射率、色散、fresnel定律） .谁动了我的cpu——oprofile使用札记下篇

宿迁高防，2C2G15M，22元/月；香港BGP，2C5G5M，25元/月 雨云优惠码：MjYwNzM=

相关文章

CSS使用overflow隐藏超出范围的内容(文本过长隐藏)

<style type="text/css">.textOverFlow {300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid #ddd;}</style><div class="textOverFlow">各类...

android学习SeekBar的使用

SeekBar介绍听歌的时候，我们常常想快进或者快退到某一时间段，听歌的时候我们控制音量大小听歌，SeekBar可以通过滑块的位置来标示数值，而且拖动条允许用户拖动滑块来改变进度条的大小SeekBar的主要属性和方法（1）setMax --- 设置SeekBar的最大数值（2）setProgress --- 设置SeekBar的当前数值（3）setSec...

ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室（八） 之 用 Redis 实现用户在线离线状态消息处理

前言 　　上篇的预告好像是“聊天室的小细节，你都注意到了吗？”。今天也是为那篇做铺垫吧。之前的版本有好多问题，比如：当前登录用户是否合法问题，userid参数如果随便传后台没有验证。还有一个致命的问题，用户AB都在线，但是如果A没有打开B的窗口或者B没有打开A的窗口，那么发消息，对方是收不到的。因为他们没有进入到同一个组里面。本篇讲述了一些Redis的东西...

使用jxls技术导入Excel模版数据(转自其他博客)

第一步：先确定好Excel导入的格式以及各表格字段值的含义 第二步：定义好解析的XML--videoConfig.xml <?xml version="1.0" encoding="UTF-8"?> <workbook> <worksheet name="Sheet1"> <sectio...

MySQL 按照日期格式查询带有时间戳数据

按照日期格式查询带有时间戳数据一般在MSQL数据库中的时间都是以时间戳的格式来存储时间的，但是对于我们来说，时间戳格式具体表示的是什么时间，我们很难一眼看出来，所以当我们要具体查询某一个时间或时间段的数据时，就要进行日期到时间戳的转换。我们常会用到这两个函数：FROM_UNIXTIME()和UNIX_TIMESTAMP()函数1. FROM_UNIXTIM...

基于WPF系统框架设计(5)-Ribbon整合Avalondock 2.0实现多文档界面设计(二)

AvalonDock 是一个.NET库，用于在停靠模式布局（docking）中排列一系列WPF/WinForm控件。最新发布的版本原生支持MVVM框架、Aero Snap特效并具有更好的性能。 AvalonDock 2.0版本已经发布了，新版本是用MVVM框架重新编写，似乎也用了Command（命令）模式。2.0版的文档尚未发布，但你可以参考Avalon....

最新文章

随机推荐

思享工具箱导航