一款清新、简约的PopupWindow

最新推荐文章于 2018-10-25 20:13:20 发布
最新推荐文章于 2018-10-25 20:13:20 发布
阅读量1.2k 收藏 1
点赞数
分类专栏： Android控件实例
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u013210620/article/details/51821148
版权

点击打开链接，免积分下载


主界面布局activity_main.xml  就是有左边右边2个imageview生成2个popupwindow

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.simplepopu.MainActivity" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:background="#333333">

        <ImageButton
            android:id="@+id/image_edit_left"
            android:layout_width="45dp"
            android:layout_height="45dp"
            android:layout_centerVertical="true"
            android:background="@null"
            android:src="@drawable/modify" />
        
        <ImageButton
            android:id="@+id/image_edit_right"
            android:layout_width="45dp"
            android:layout_height="45dp"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:background="@null"
            android:src="@drawable/modify" />
    </RelativeLayout>

</LinearLayout>

先看左边的popupwindow把

contact_edit_popu_layout_left.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/popuItem1"
        style="@style/PopuTextStyleLeft"
        android:background="@drawable/apply_centfication_sele_left_top"
        android:text="11111" />

    <TextView
        android:id="@+id/popuItem2"
        style="@style/PopuTextStyleLeft"
          android:background="@drawable/apply_centfication_sele_left_mid"
        android:text="22222" />

    <TextView
        android:id="@+id/popuItem3"
        style="@style/PopuTextStyleLeft"
          android:background="@drawable/apply_centfication_sele_left_bottom"
        android:text="33333" />
    
    

</LinearLayout>

    
     <style name="PopuTextStyle">
        <item name="android:layout_width">193dp</item>
        <item name="android:layout_height">40dp</item>
        <item name="android:gravity">center_vertical</item>
        <item name="android:paddingLeft">20dp</item>
        <item name="android:textSize">16sp</item>
        <item name="android:textColor">#333333</item>
    </style>

apply_centfication_sele_left_top.xml 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true"><shape>
            <corners android:topLeftRadius="5dp" android:topRightRadius="5dp"></corners>

            <solid android:color="#e6e6e6" />
        </shape></item>
    <item><shape>
            <corners android:topLeftRadius="5dp" android:topRightRadius="5dp"></corners>

            <solid android:color="#ffffff" />
        </shape></item>

</selector>

apply_centfication_sele_left_mid.xml 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true"><shape>

            <solid android:color="#e6e6e6" />
        </shape></item>
    <item><shape>
            <solid android:color="#ffffff" />
        </shape></item>

</selector>

apply_centfication_sele_left_bottom.xml 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true"><shape>
            <corners android:bottomLeftRadius="5dp" android:bottomRightRadius="5dp"></corners>

            <solid android:color="#e6e6e6" />
        </shape></item>
    <item><shape>
            <corners android:bottomLeftRadius="5dp" android:bottomRightRadius="5dp"></corners>

            <solid android:color="#ffffff" />
        </shape></item>

</selector>

ContactEditPopuLeft 

package com.example.simplepopu;

import android.app.Activity;
import android.graphics.drawable.BitmapDrawable;
import android.text.TextUtils;
import android.view.LayoutInflater;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.widget.PopupWindow;
import android.widget.TextView;

/**
 * Created by Safly on 2016/7/4.
 */
public class ContactEditPopuLeft extends PopupWindow implements View.OnClickListener, PopupWindow.OnDismissListener {

    private static final String TAG = "ContactEditPopu";

    private TextView item1,item2,item3;

    private ItemClickListener listener;
private Activity context;
    public ContactEditPopuLeft(Activity context,String[] itemTexts){
        LayoutInflater mInflater = LayoutInflater.from(context);
        View contentView = mInflater.inflate(R.layout.contact_edit_popu_layout_left, null);
        this.context = context;
        item1 = (TextView) contentView.findViewById(R.id.popuItem1);
        item2 = (TextView) contentView.findViewById(R.id.popuItem2);
        item3 = (TextView) contentView.findViewById(R.id.popuItem3);
        item1.setOnClickListener(this);
        item2.setOnClickListener(this);
        item3.setOnClickListener(this);

        if(itemTexts != null){
            int length = itemTexts.length;
            this.setContentView(contentView);
            switch (length){
                //只有1个item--新建联系人
                case 1:
                	item1.setText(itemTexts[0]);
                	item2.setVisibility(View.GONE);
                	item3.setVisibility(View.GONE);
                    break;
                    //只有2个item--新建联系人、删除联系人
                case 2:
                	item1.setText(itemTexts[0]);
                	item3.setText(itemTexts[1]);
                	
                	item2.setVisibility(View.GONE);
                	
                    break;
                case 3:
                	//只有3个item--新建联系人、编辑联系人、删除联系人
                	item1.setText(itemTexts[0]);
                	item2.setText(itemTexts[1]);
                	item3.setText(itemTexts[2]);
                	
                	
                    break;
            }
        }

        this.setOnDismissListener(this);
        this.setFocusable(true);
        this.setOutsideTouchable(true);
        this.setWidth(-2);
        this.setHeight(-2);

        this.setBackgroundDrawable(new BitmapDrawable());
    }

    @Override
    public void onClick(View v) {
        if(listener != null){
            switch (v.getId()){
                case R.id.popuItem1:
                    listener.item1Listener();
                    break;
                case R.id.popuItem2:
                    listener.item2Listener();
                    break;
                case R.id.popuItem3:
                    listener.item3Listener();
                    break;
            }
        }
        this.dismiss();
    }

    public void showToggle(View parent, int gravity,int xoff,int yoff){
        if(isShowing()){
            dismiss();
        }else{
            showAtLocation(parent,gravity,xoff,yoff);
            Window window = ((Activity) context).getWindow();
            WindowManager.LayoutParams params = window.getAttributes();
            params.alpha = 0.6f;
            window.setAttributes(params);
        }
    }

    public void setItemListener(ItemClickListener listener){
        this.listener = listener;
    }

    @Override
    public void onDismiss() {
        Window window = ((Activity) context).getWindow();
        WindowManager.LayoutParams params = window.getAttributes();
        params.alpha = 1.0f;
        window.setAttributes(params);
    }

    public interface ItemClickListener{
         void item1Listener();
         void item2Listener();
         void item3Listener();
    }


    
    
}

####################################接下来看右边popupwindow的布局###########################
接下来看右边popupwindow的布局

contact_edit_popu_layout_right.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/popuItem1"
        style="@style/PopuTextStyle"
        android:background="@drawable/popup_bg_top"
        android:text="11111" />

    <TextView
        android:id="@+id/popuItem2"
        style="@style/PopuTextStyle"
        android:background="@drawable/apply_centfication_sele_mid"
        android:text="22222" />

    <TextView
        android:id="@+id/popuItem3"
        style="@style/PopuTextStyle"
        android:background="@drawable/apply_centfication_sele_bottom"
        android:text="33333" />
    
    
    <TextView
        android:id="@+id/popuItem4"
        style="@style/PopuTextStyle"
        android:background="@drawable/apply_centfication_sele_all"
        android:text="44444"/>
    
    

</LinearLayout>

<style name="PopuTextStyle">
        <item name="android:layout_width">193dp</item>
        <item name="android:layout_height">40dp</item>
        <item name="android:gravity">center_vertical</item>
        <item name="android:paddingLeft">20dp</item>
        <item name="android:textSize">16sp</item>
        <item name="android:textColor">#333333</item>
    </style>

popup_bg_top.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true" android:drawable="@drawable/popup_top_press"/>
    <item android:state_pressed="false" android:drawable="@drawable/popup_top_normal"/>
    <item android:drawable="@drawable/popup_top_normal"/>
</selector>

apply_centfication_sele_mid.xml 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true" android:drawable="@drawable/popup_mid_press"/>
    <item android:state_pressed="false" android:drawable="@drawable/popup_mid_normal"/>
    <item android:drawable="@drawable/popup_mid_normal"/>
</selector>

apply_centfication_sele_bottom.xml 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true" android:drawable="@drawable/popup_bottom_press"/>
    <item android:state_pressed="false" android:drawable="@drawable/popup_bottom_normal"/>
    <item android:drawable="@drawable/popup_bottom_normal"/>
</selector>

apply_centfication_sele_all.xml 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true" android:drawable="@drawable/popup_all_press"/>
    <item android:state_pressed="false" android:drawable="@drawable/popup_all_normal"/>
    <item android:drawable="@drawable/popup_all_normal"/>
</selector>

ContactEditPopuRight 

package com.example.simplepopu;

import android.app.Activity;
import android.graphics.drawable.BitmapDrawable;
import android.text.TextUtils;
import android.view.LayoutInflater;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.widget.PopupWindow;
import android.widget.TextView;

/**
 * Created by Safly on 2016/7/4.
 */
public class ContactEditPopuRight extends PopupWindow implements View.OnClickListener, PopupWindow.OnDismissListener {

    private static final String TAG = "ContactEditPopu";

    private TextView item1,item2,item3,item4;

    private ItemClickListener listener;
    public ContactEditPopuRight(Activity context,String[] itemTexts){
        LayoutInflater mInflater = LayoutInflater.from(context);
        View contentView = mInflater.inflate(R.layout.contact_edit_popu_layout_right, null);
        item1 = (TextView) contentView.findViewById(R.id.popuItem1);
        item2 = (TextView) contentView.findViewById(R.id.popuItem2);
        item3 = (TextView) contentView.findViewById(R.id.popuItem3);
        item4 = (TextView) contentView.findViewById(R.id.popuItem4);
        item1.setOnClickListener(this);
        item2.setOnClickListener(this);
        item3.setOnClickListener(this);
        item4.setOnClickListener(this);

        if(itemTexts != null){
            int length = itemTexts.length;
            this.setContentView(contentView);
            switch (length){
                //只有1个item--新建联系人
                case 1:

                	item4.setText(itemTexts[0]);
                	item1.setVisibility(View.GONE);
                	item2.setVisibility(View.GONE);
                	item3.setVisibility(View.GONE);
                    break;
                    //只有2个item--新建联系人、删除联系人
                case 2:
                	item1.setText(itemTexts[0]);
                	item3.setText(itemTexts[1]);
                	
                	item2.setVisibility(View.GONE);
                	item4.setVisibility(View.GONE);
                	
                    break;
                case 3:
                	//只有3个item--新建联系人、编辑联系人、删除联系人
                	item1.setText(itemTexts[0]);
                	item2.setText(itemTexts[1]);
                	item3.setText(itemTexts[2]);
                	
                	item4.setVisibility(View.GONE);
                	
                    break;
            }
        }

        this.setOnDismissListener(this);
        this.setFocusable(true);
        this.setOutsideTouchable(true);
        this.setWidth(-2);
        this.setHeight(-2);

        this.setBackgroundDrawable(new BitmapDrawable());
    }

    @Override
    public void onClick(View v) {
        if(listener != null){
            switch (v.getId()){
                case R.id.popuItem1:
                    listener.rightItem1Listener();
                    break;
                case R.id.popuItem2:
                    listener.rightItem2Listener();
                    break;
                case R.id.popuItem3:
                    listener.rightItem3Listener();
                    break;
                case R.id.popuItem4:
                	listener.rightItem4Listener();
                	break;
            }
        }
        this.dismiss();
    }

    public void showToggle(View parent, int gravity,int xoff,int yoff){
        if(isShowing()){
            dismiss();
        }else{
            showAtLocation(parent,gravity,xoff,yoff);
        }
    }

    public void setItemListener(ItemClickListener listener){
        this.listener = listener;
    }

    @Override
    public void onDismiss() {
    }

    public interface ItemClickListener{
         void rightItem1Listener();
         void rightItem2Listener();
         void rightItem3Listener();
         void rightItem4Listener();
    }


    
    
}


最后看主界面代码

MainActivity

package com.example.simplepopu;


import android.app.Activity;
import android.os.Bundle;
import android.view.Gravity;
import android.view.View;
import android.view.Window;
import android.widget.Toast;

public class MainActivity extends Activity implements
		ContactEditPopuLeft.ItemClickListener,  ContactEditPopuRight.ItemClickListener{
/**
 * 获取状态栏的高度
 * @return
 */
	public int getStatusHeight() {

		int statusHeight = -1;
		try {
			Class<?> clazz = Class.forName("com.android.internal.R$dimen");
			Object object = clazz.newInstance();
			int height = Integer.parseInt(clazz.getField("status_bar_height")
					.get(object).toString());
			statusHeight = getResources().getDimensionPixelSize(height);
		} catch (Exception e) {
			e.printStackTrace();
		}
		return statusHeight;
	}

	private int popupStyle = 1;
	private int popupLeftStyle = 2;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		setContentView(R.layout.activity_main);

		/**
		 * 右边的popupwindow
		 */
		findViewById(R.id.image_edit_left).setOnClickListener(
				new View.OnClickListener() {
					@Override
					public void onClick(View v) {
						ContactEditPopuLeft popu = null;
						switch (popupLeftStyle) {

						case 2:
							popu = new ContactEditPopuLeft(
								MainActivity.this, new String[] {
										"新建联系人" , "删除联系人"});
							popupLeftStyle = 3;

							break;
						case 3:
							popu = new ContactEditPopuLeft(
									MainActivity.this, new String[] { 
											"新建联系人", "编辑联系人" ,"删除联系人"});
							popupLeftStyle = 2;
							break;
						}
						
						// 相对于整个屏幕--x不动（为正向左偏移），y坐标移动标题栏+控件高
						popu.showToggle(v, Gravity.TOP | Gravity.LEFT, 0,
								(int) (v.getHeight() + getStatusHeight()));
						popu.setItemListener(MainActivity.this);

					}
				});
		
		/**
		 * 左边的popupwindow
		 */
		findViewById(R.id.image_edit_right).setOnClickListener(new View.OnClickListener() {
			
			@Override
			public void onClick(View v) {

				ContactEditPopuRight popuRight = null;
				switch (popupStyle) {
				case 1:
					popuRight = new ContactEditPopuRight(
							MainActivity.this, new String[] {"新建联系人" });
					popupStyle = 2;
					break;

				case 2:
					popuRight = new ContactEditPopuRight(
						MainActivity.this, new String[] {
								"新建联系人" , "删除联系人"});
					popupStyle = 3;

					break;
				case 3:
					popuRight = new ContactEditPopuRight(
							MainActivity.this, new String[] { 
									"新建联系人", "编辑联系人" ,"删除联系人"});
					popupStyle = 1;
					break;
				}
				
				// 相对于整个屏幕--x不动（为正向左偏移），y坐标移动标题栏+控件高
				popuRight.showToggle(v, Gravity.RIGHT | Gravity.TOP, 0,
						(int) (v.getHeight() + getStatusHeight()));
				popuRight.setItemListener(MainActivity.this);

			
			}
		});

	}

	@Override
	public void item1Listener() {

	}

	@Override
	public void item2Listener() {

	}

	@Override
	public void item3Listener() {

	}


	/**
	 * 右边的popupwindow的监听事件
	 */
	@Override
	public void rightItem1Listener() {
		// TODO Auto-generated method stub
	}

	@Override
	public void rightItem2Listener() {
		// TODO Auto-generated method stub
		
	}

	@Override
	public void rightItem3Listener() {
		// TODO Auto-generated method stub
		
	}

	@Override
	public void rightItem4Listener() {
		// TODO Auto-generated method stub
		
	}
}


易辰_
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
一款清新简易的通用的popupwindow
07-04
一款清新简易的通用的popupwindow，一般app都有这样的需求
android精美菜单设计,Android 简单封装一个精美、好用的菜单型PopupWindow
weixin_28789499的博客
05-26 300
先上效果图： 就是这样一个菜单型的PopupWindow，现在说下是怎么弄的，先看一个布局文件，这个布局文件package cn.edu.jxufe.popupwindowdemo;import android.content.Context;import android.graphics.drawable.BitmapDrawable;import android.view.LayoutInfl...
Android popupWindow的简单使用
yijiaodingqiankun的博客
04-22 297
View inflate = View.inflate(PersonActivity.this, R.layout.popupwindow, null); //这里面的参数表示设置popupwindow 的宽和高 PopupWindow popupWindow = new PopupWindow(inflate, ViewGroup.LayoutParams.MATCH_PARENT, ViewG...
Android基础---PopupWindow实现漂亮的搜索
Sean_css的博客
04-21 1993
当初做毕业设计的时候，就在毕业设计 App 上面实现了该功能，当初只是简单的堆积代码，代码都是从别处拷贝了，对具体代码的意思也不是很清楚，现在做了一个简单的开源项目，也实现了该搜索功能，现在对 PopupWindow 有了更新的认识。本文会一步一步的教你实现效果图中的效果，包会。。。如果还是不会的话，欢饮点击下面的链接去看看我的项目中怎么用的。我的开源项目：Gank.io客户端 App 下载地址
Android 简单封装一个精美、好用的菜单型PopupWindow
个人博客
05-10 6444
就是这样一个菜单型的PopupWindow，现在说下是怎么弄的， 先看一个布局文件，这个布局文件package
[仿南航app开发日记7]自绘漂亮的课程表界面
伯兰的博客
12-29 4246
前言 前面的博客里面分别讲到了自定义ViewGroup（侧滑菜单）、自定义Dialog（登陆对话框以及背景透明进度条）、使用PopupWindow（下拉方式选择年份），那么今天要讲的是自绘课程表界面，属于android绘图知识，在这之前我也写过课程表界面，不过当时使用的GridView+Adapter来制作课程表，不过效果不是很好，链接如下： http://blog.csdn.net/s...
Android popupwindow 示例程序一
06-11
经过多番测试实践，实现了popupwindow 弹出在指定控件的下方。代码上有注释，有需要注意的地方。popupwindow 有自已的布局，里面控件的监听实现都有。
PopupWindow
01-20
PopupWindow
popupWindow使用Demo
01-19
使用popupWindow实现类似微信点击右上角加号弹出添加好友的列表，还有在底部弹出的popupWindow
Vue实现PopupWindow组件详解
08-27
主要为大家详细介绍了Vue实现PopupWindow组件，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
vue-popupwindow
07-29
使用vue.js实现的popupwindow组件
PopupWindow 使用详解（二） Popwindow 制作常见花哨效果
韩小呆的博客
10-25 2664
帝都几日降温，终于被撂倒了。but 只要一息尚存就得不断进步！于是，写出 《PopupWindow 使用详解》的第二篇 笔记，先奉上 第一篇链接: 《PopupWindow 使用详解（一） 中文API 文档 赠送 ListPopupWindow 中文 API》 。下面给大家展示一下制作的效果gif。 下面进行一个样式一个样式的肢解哈，对了，所有效果笔者都没有制作载入动画和退出动画。有需要的小伙...
分享一个Android封装精美、好用的菜单型PopupWindow
RIn's Blog
08-13 1065
先上效果图： 就是这样一个菜单型悬浮的PopupWindow，标签可添加，点击展开。现在说下是怎么弄的
设置PopupWindow为圆角
PsuAiJe的网络学习笔记本
03-12 1万+
Android自定义PopupWindow，高仿炫酷的IOS对话框
宿罪的博客
05-12 1407
前言：  最近在使用IOS系统的过程中发现IOS底部弹出框甚是漂亮，大气，上档次，于是乎就想啊能不能在Android中实现类似的对话框呢？你说，这不是废话吗，除了一些极少数的系统级的不能模仿外（版权）还有啥不能依瓢画葫芦的呢，所以啊，这篇文章将介绍如何在Android中实现高仿IOS对话框效果，先上图，给大家养养眼： 大家在看到上面的对话框时有没有想到简单的实现思路呢？我这里给出的思路是我...
Android PopupWindow弹出窗口的完美实现（实现弹出背景变暗效果）
热门推荐
女程序媛的自我修养
05-07 1万+
最近尝试使用popupWindow实现背景变暗效果，自己优化了一下，并封装成一个可以调用的方法，默认实现弹出窗口显示在传入view的下方，以下代码有详细注释，有问题可以留言展示效果如下： 代码展示布局中<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width
一个值得收藏的popupWindow
puyaCheer的博客
02-28 423
不需要任何其他工具，就是一个类 package com.example.zhouwei.library; import android.content.Context; import android.graphics.Color; import android.graphics.drawable.ColorDrawable; import android.os.Build; import
Android popupwindow
最新发布
08-25
PopupWindow 是 Android 中的一个弹出式窗口，它可以覆盖在其他视图之上，提供一种临时性的用户界面。你可以使用 PopupWindow 来显示额外的内容、菜单或者交互提示。 要创建一个 PopupWindow，首先你需要实例化一个...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值