自定义PopupWindow，带显示隐藏动画、全屏背景以及触摸屏幕空白区域消失的功能

先来大致介绍写PopupWindow的常规默认状态的几点不好的地方：

1.显示隐藏的时候都是瞬间的，没有任何过度动画。

2.无法通过点击屏幕的空白区域使其关闭。

3.无法在弹窗显示的时候，在其背后加上黑色遮罩。

用过AlertDialog的同学会发现，其实上面三个特性AlertDialog都是自带的效果或通过自带api可以轻松实现，那么我们为什么非要使用PopupWindow呢？那是因为AlertDialog的显示位置非常难调整，并且应为AlertDialog的默认背景是一个sprite9的图片（黑色遮罩），导致他的宽度无法满屏。所以我们需要使用PopupWindow来解决上述问题。

PopupWindow有两种基本的显示方式：

1.显示在某个view的正左下方

    /**
     * <p>Display the content view in a popup window anchored to the bottom-left
     * corner of the anchor view. If there is not enough room on screen to show
     * the popup in its entirety, this method tries to find a parent scroll
     * view to scroll. If no parent scroll view can be scrolled, the bottom-left
     * corner of the popup is pinned at the top left corner of the anchor view.</p>
     *
     * @param anchor the view on which to pin the popup window
     *
     * @see #dismiss()
     */
    public void showAsDropDown(View anchor) {
        showAsDropDown(anchor, 0, 0);
    }

2.显示在父view的指定位置（底部，顶部等）

    /**
     * <p>
     * Display the content view in a popup window at the specified location. If the popup window
     * cannot fit on screen, it will be clipped. See {@link android.view.WindowManager.LayoutParams}
     * for more information on how gravity and the x and y parameters are related. Specifying
     * a gravity of {@link android.view.Gravity#NO_GRAVITY} is similar to specifying
     * <code>Gravity.LEFT | Gravity.TOP</code>.
     * </p>
     * 
     * @param parent a parent view to get the {@link android.view.View#getWindowToken()} token from
     * @param gravity the gravity which controls the placement of the popup window
     * @param x the popup's x location offset
     * @param y the popup's y location offset
     */
    public void showAtLocation(View parent, int gravity, int x, int y) {
        showAtLocation(parent.getWindowToken(), gravity, x, y);
    }

基本概念就介绍到这，下面来看看如何具体的实现一个能满足我们需要的PopupWindow，先展示一个最终效果图:

正式开始写代码阶段

初始化PopupWindow:

    View view = LayoutInflater.from(this).inflate(R.layout.dialog_share_to, null);
    //这是大小，宽度满屏，高度自适应
    mSharePopupWindow = new PopupWindow(view,
            LinearLayout.LayoutParams.MATCH_PARENT,
            LinearLayout.LayoutParams.WRAP_CONTENT);
    //设置获取焦点
    mSharePopupWindow.setFocusable(true);
    //设置可触摸
    mSharePopupWindow.setTouchable(true);
    //设置外部可以点击
    mSharePopupWindow.setOutsideTouchable(true);
    //设置空背景，必须加上，可以让外部点击事件被触发
    mSharePopupWindow.setBackgroundDrawable(new BitmapDrawable());
    //设置显示隐藏的动画
    mSharePopupWindow.setAnimationStyle(R.style.popup_window_anim);
    //消失的时候，恢复背景遮罩的透明度
    mSharePopupWindow.setOnDismissListener(new PopupWindow.OnDismissListener() {
        @Override
        public void onDismiss() {
            modifyActivityAlpha(1);
        }
    });

      //取消点击事件<span style="white-space:pre">	</span>
    view.findViewById(R.id.rl_cancel).setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            mSharePopupWindow.dismiss();
        }
    });

显示PopupWindow:

    private void showShareToPopupWindow() {

        //<span style="font-family: Arial, Helvetica, sans-serif;">rl_main是我们指定的父view</span>
        mSharePopupWindow.showAtLocation(findViewById(R.id.rl_main), Gravity.BOTTOM, 0, 0);
        modifyActivityAlpha(0.5f);
    }

修改系统背景透明度的方法:

    private void modifyActivityAlpha(float alpha) {
        WindowManager.LayoutParams params = getWindow().getAttributes();
        params.alpha = alpha;
        getWindow().setAttributes(params);
    }

styles.xml里面定义的动画样式

    <style name="popup_window_anim">
        <item name="android:windowEnterAnimation">@anim/fade_in</item>
        <item name="android:windowExitAnimation">@anim/fade_out</item>
    </style>

fade_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:duration="100"
        android:fromAlpha="0.0"
        android:interpolator="@android:anim/decelerate_interpolator"
        android:toAlpha="1.0" />
</set>

fade_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:interpolator="@android:anim/accelerate_interpolator"
        android:fromAlpha="1.0"
        android:toAlpha="0.0"
        android:duration="100" />
</set>

最后贴下popupWindow的布局:

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="14dp"
        android:text="分享到"
        android:textColor="#333333"
        android:textSize="15sp" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="115dp"
        android:gravity="center"
        android:orientation="horizontal"
        android:paddingBottom="16dp"
        android:paddingLeft="10dp"
        android:paddingRight="10dp"
        android:paddingTop="16dp">

        <RelativeLayout
            android:id="@+id/rl_share_transfer"
            style="@style/dialog_share_to_rl">

            <ImageView
                android:id="@+id/iv_share_transfer"
                style="@style/dialog_share_to_iv"
                android:layout_above="@+id/view_center_1"
                android:background="@drawable/share_transfer" />

            <View
                android:id="@+id/view_center_1"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_centerInParent="true" />

            <TextView
                style="@style/dialog_share_to_tv"
                android:layout_below="@+id/view_center_1"
                android:text="用户中转站" />
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/rl_share_private"
            style="@style/dialog_share_to_rl">

            <ImageView
                style="@style/dialog_share_to_iv"
                android:layout_above="@+id/view_center_2"
                android:background="@drawable/share_private" />

            <View
                android:id="@+id/view_center_2"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_centerInParent="true" />

            <TextView
                style="@style/dialog_share_to_tv"
                android:layout_below="@+id/view_center_2"
                android:text="秘钥分享" />
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/rl_share_public"
            style="@style/dialog_share_to_rl">

            <ImageView
                style="@style/dialog_share_to_iv"
                android:layout_above="@+id/view_center_3"
                android:background="@drawable/share_public" />

            <View
                android:id="@+id/view_center_3"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_centerInParent="true" />

            <TextView
                style="@style/dialog_share_to_tv"
                android:layout_below="@+id/view_center_3"
                android:text="公钥分享" />
        </RelativeLayout>
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="10dp"
        android:background="#f3f3f3"></View>

    <RelativeLayout
        android:id="@+id/rl_cancel"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="@drawable/xml_btn_nothing2grey_sel"
        android:clickable="true">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="取消"
            android:textColor="#2692ee"
            android:textSize="15sp" />
    </RelativeLayout>

</LinearLayout>