Android PopupWindow使用方法小结 _popupwindow

知识养成了思想,思想同时又在融化知识。这篇文章主要讲述Android PopupWindow使用方法小结相关的知识，希望能为你提供帮助。
前几天要用到PopupWindow，一时竟想不起来怎么用，赶紧上网查了查，自己写了个demo，并在此记录一下PopupWindow的用法。
使用场景PopupWindow，顾名思义，就是弹窗，在很多场景下都可以见到它。例如ActionBar/Toolbar的选项弹窗，一组选项的容器，或者列表等集合的窗口等等。
基本用法【Android PopupWindow使用方法小结】使用PopupWindow很简单，可以总结为三个步骤：

创建PopupWindow对象实例；
设置背景、注册事件监听器和添加动画；
显示PopupWindow。

其中，第二步是可选的（不过基本上都要进行第二步的设置）。下面是一个简单的例子：

1// 用于PopupWindow的View 2View contentView=LayoutInflater.from(context).inflate(layoutRes, null, false); 3// 创建PopupWindow对象，其中： 4// 第一个参数是用于PopupWindow中的View，第二个参数是PopupWindow的宽度， 5// 第三个参数是PopupWindow的高度，第四个参数指定PopupWindow能否获得焦点 6PopupWindow window=new PopupWindow(contentView, 100, 100, true); 7// 设置PopupWindow的背景 8window.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT)); 9// 设置PopupWindow是否能响应外部点击事件 10window.setOutsideTouchable(true); 11// 设置PopupWindow是否能响应点击事件 12window.setTouchable(true); 13// 显示PopupWindow，其中： 14// 第一个参数是PopupWindow的锚点，第二和第三个参数分别是PopupWindow相对锚点的x、y偏移 15window.showAsDropDown(anchor, xoff, yoff); 16// 或者也可以调用此方法显示PopupWindow，其中： 17// 第一个参数是PopupWindow的父View，第二个参数是PopupWindow相对父View的位置， 18// 第三和第四个参数分别是PopupWindow相对父View的x、y偏移 19// window.showAtLocation(parent, gravity, x, y);

每个方法的作用都写在注解里了，相信大家都能看懂。不过这里要注意这两行：

1window.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT)); 2window.setOutsideTouchable(true);

只有同时设置PopupWindow的背景和可以响应外部点击事件，它才能“真正”响应外部点击事件。也就是说，当你点击PopupWindow的外部或者按下“Back”键时，PopupWindow才会消失。
使用showAsDropDown方法显示PopupWindow 通常情况下，调用showAsDropDown方法后PopupWindow将会在锚点的左下方显示（drop down）。但是，有时想让PopupWindow在锚点的上方显示，或者在锚点的中间位置显示，此时就需要用到showAsDropDown方法的xoff和yoff参数了。

这里我们的目的不仅包括上面提到的两种情况（锚点上方或锚点中部），而是囊括了水平和垂直方向各5种显示方式：

水平方向：
- ALIGN_LEFT：在锚点内部的左边；
- ALIGN_RIGHT：在锚点内部的右边；
- CENTER_HORI：在锚点水平中部；
- TO_RIGHT：在锚点外部的右边；
- TO_LEFT：在锚点外部的左边。
垂直方向：
- ALIGN_ABOVE：在锚点内部的上方；
- ALIGN_BOTTOM：在锚点内部的下方；
- CENTER_VERT：在锚点垂直中部；
- TO_BOTTOM：在锚点外部的下方；
- TO_ABOVE：在锚点外部的上方。

下面来看张图：

文章图片

文章图片

我们先定义一个类对PopupWindow进行简单的封装：

1 public abstract class CommonPopupWindow { 2protected Context context; 3protected View contentView; 4protected PopupWindow mInstance; 5 6public CommonPopupWindow(Context c, int layoutRes, int w, int h) { 7context=c; 8contentView=LayoutInflater.from(c).inflate(layoutRes, null, false); 9initView(); 10initEvent(); 11mInstance=new PopupWindow(contentView, w, h, true); 12initWindow(); 13} 14 15public View getContentView() { return contentView; } 16public PopupWindow getPopupWindow() { return mInstance; } 17 18protected abstract void initView(); 19protected abstract void initEvent(); 20 21protected void initWindow() { 22mInstance.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT)); 23mInstance.setOutsideTouchable(true); 24mInstance.setTouchable(true); 25} 26 27public void showBashOfAnchor(View anchor, LayoutGravity layoutGravity, int xmerge, int ymerge) { 28int[] offset=layoutGravity.getOffset(anchor, mInstance); 29mInstance.showAsDropDown(anchor, offset[0]+xmerge, offset[1]+ymerge); 30} 31 32public void showAsDropDown(View anchor, int xoff, int yoff) { 33mInstance.showAsDropDown(anchor, xoff, yoff); 34} 35 36public void showAtLocation(View parent, int gravity, int x, int y) { 37mInstance.showAtLocation(parent, gravity, x, y); 38} 39 }

这里我们要实现的就是“showBashOfAnchor”方法，其中有一个“LayoutGravity”类型的参数，这就是控制PopupWindow相对锚点位置的对象。下面来定义“LayoutGravity”：

1 public static class LayoutGravity { 2private int layoutGravity; 3// waring, don\'t change the order of these constants! 4public static final int ALIGN_LEFT=0x1; 5public static final int ALIGN_ABOVE=0x2; 6public static final int ALIGN_RIGHT=0x4; 7public static final int ALIGN_BOTTOM=0x8; 8public static final int TO_LEFT=0x10; 9public static final int TO_ABOVE=0x20; 10public static final int TO_RIGHT=0x40; 11public static final int TO_BOTTOM=0x80; 12public static final int CENTER_HORI=0x100; 13public static final int CENTER_VERT=0x200; 14 15public LayoutGravity(int gravity) { 16layoutGravity=gravity; 17} 18 19public int getLayoutGravity() { return layoutGravity; } 20public void setLayoutGravity(int gravity) { layoutGravity=gravity; } 21 22public void setHoriGravity(int gravity) { 23layoutGravity& =(0x2+0x8+0x20+0x80+0x200); 24layoutGravity|=gravity; 25} 26public void setVertGravity(int gravity) { 27layoutGravity& =(0x1+0x4+0x10+0x40+0x100); 28layoutGravity|=gravity; 29} 30 31public boolean isParamFit(int param) { 32return (layoutGravity & param) > 0; 33} 34 35public int getHoriParam() { 36for(int i=0x1; i< =0x100; i=i< < 2) 37if(isParamFit(i)) 38return i; 39return ALIGN_LEFT; 40} 41 42public int getVertParam() { 43for(int i=0x2; i< =0x200; i=i< < 2) 44if(isParamFit(i)) 45return i; 46return TO_BOTTOM; 47} 48 49public int[] getOffset(View anchor, PopupWindow window) { 50int anchWidth=anchor.getWidth(); 51int anchHeight=anchor.getHeight(); 52 53int winWidth=window.getWidth(); 54int winHeight=window.getHeight(); 55View view=window.getContentView(); 56if(winWidth< =0) 57winWidth=view.getWidth(); 58if(winHeight< =0) 59winHeight=view.getHeight(); 60 61int xoff=0; 62int yoff=0; 63 64switch (getHoriParam()) { 65case ALIGN_LEFT: 66xoff=0; break; 67case ALIGN_RIGHT: 68xoff=anchWidth-winWidth; break; 69case TO_LEFT: 70xoff=-winWidth; break; 71case TO_RIGHT: 72xoff=anchWidth; break; 73case CENTER_HORI: 74xoff=(anchWidth-winWidth)/2; break; 75default:break; 76} 77switch (getVertParam()) { 78case ALIGN_ABOVE: 79yoff=-anchHeight; break; 80case ALIGN_BOTTOM: 81yoff=-winHeight; break; 82case TO_ABOVE: 83yoff=-anchHeight-winHeight; break; 84case TO_BOTTOM: 85yoff=0; break; 86case CENTER_VERT: 87yoff=(-winHeight-anchHeight)/2; break; 88default:break; 89} 90return new int[]{ xoff, yoff }; 91} 92 }

这里的主要方法就是“getOffset”，它会根据水平和垂直方向的gravity决定PopupWindow相对锚点的位置。

使用“LayoutGravity”时，可以通过“setHoriGravity”和“setVertGravity”方法设置水平和垂直方向的gravity，或者新建一个“LayoutGravity”对象。

下面是一个demo：

文章图片

使用setAnimationStyle方法添加动画上面我们提到了为PopupWindow设置背景和注册事件监听器，现在我们再来为PopupWindow添加动画。

这里的动画是指PopupWindow出现和消失时的动画。默认是直接弹出和消失，这样难免让用户有一种突兀的感觉；如果PopupWindow能够“滑入”屏幕和“滑出”屏幕（或者其他方式），用户体验会更好。

为PopupWindow添加动画可以调用`setAnimationStyle`方法，该方法只有一个参数，就是指定动画的样式，因此我们需要定义动画资源和样式资源。

下面是一个“滑入滑出”动画：

1 < !-- res/anim/translate_in.xml --> 2 < ?xml version="1.0" encoding="utf-8"?> 3 < set xmlns:android="http://schemas.android.com/apk/res/android"> 4< translate 5android:fromXDelta="0" 6android:toXDelta="0" 7android:fromYDelta="100%" 8android:toYDelta="0" 9android:duration="200" > 10< /translate> 11 < /set>

1 < !-- res/anim/translate_out.xml --> 2 < ?xml version="1.0" encoding="utf-8"?> 3 < set xmlns:android="http://schemas.android.com/apk/res/android"> 4< translate 5android:fromXDelta="0" 6android:toXDelta="0" 7android:fromYDelta="0" 8android:toYDelta="100%" 9android:duration="200" > 10< /translate> 11 < /set>

然后定义“滑动”动画样式：

1 < !-- res/values/styles.xml --> 2< style name="animTranslate"> 3< item name="android:windowEnterAnimation"> @anim/translate_in< /item> 4< item name="android:windowExitAnimation"> @anim/translate_out< /item> 5< /style>

现在我们就可以为PopupWindow添加“滑动”动画了：

1 window.setAnimationStyle(R.style.animTranslate);

我们来看下效果：

文章图片

PS：这里由于动画的时间太短（200ms），另外转GIF的时候可能截取的频率有点低，导致滑动效果不是很明显，建议自己运行demo查看

现在PopupWindow的出现/消失已经不是那么突兀了。不过，当弹窗出现后，发现弹窗和背景不是很容易区分，如果此时弹窗的背景能“变暗”就好了。

没问题，我们可以在弹窗出现后让背景变暗，并在弹窗消失后让背景还原：

1window.setOnDismissListener(new PopupWindow.OnDismissListener() { 2@Override 3public void onDismiss() { 4WindowManager.LayoutParams lp=getWindow().getAttributes(); 5lp.alpha=1.0f; 6getWindow().clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND); 7getWindow().setAttributes(lp); 8} 9}); 10 11window.showAtLocation(activityPopup, Gravity.BOTTOM, 0, 0); 12WindowManager.LayoutParams lp=getWindow().getAttributes(); 13lp.alpha=0.3f; 14getWindow().addFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND); 15getWindow().setAttributes(lp);

现在再来看下效果：