popupwindow 底部弹出+背景半透明

最新推荐文章于 2020-07-13 17:48:29 发布

原创最新推荐文章于 2020-07-13 17:48:29 发布 · 1.6k 阅读

1 ·

CC 4.0 BY-SA版权

本文介绍了如何使用PopupWindow在Android中实现底部弹出并设置背景为半透明的效果。通过调整布局和动画，以达到理想的显示和过渡效果。同时提供了一段包含完整代码的示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先是布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/popup_linear"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/translucent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:layout_marginTop="14dp"
        android:padding="14dp"
        >

        <ImageView
            android:id="@+id/img_type"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="centerInside"
            />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/bg_popup_photo"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/take_photo_tv"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:padding="15dp"
            android:textSize="@dimen/text_medium"
            android:text="拍照"
            android:textColor="@color/blue" />

        <View
            android:layout_width="match_parent"
            android:layout_height="1px"
            android:background="@color/divide_line" />

        <TextView
            android:id="@+id/gallery_photo_tv"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:padding="15dp"
            android:text="从手机相册选择"
            android:textSize="@dimen/text_medium"
            android:textColor="@color/blue" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/bg_popup_photo"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="20dp"
        android:orientation="vertical" >

    <TextView
        android:id="@+id/photo_cancle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:padding="15dp"
        android:textSize="@dimen/text_medium"
        android:text="取消"
        android:textColor="@color/blue" />

</LinearLayout>
</LinearLayout>

布局里的最外层布局可以是透明的也可以是半透明的，可以在下面设置。translucent这个是半透明

 public ImagePopupWindow(Context context) {
//        super(context);
        this.mContext=context;
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View view = inflater.inflate(R.layout.popup_get_pic, null);

        setContentView(view);
        //这句话必须要有，如果没有点击背景是全黑，除非你先点击了别的设置了这个属性的popupwindow
        view.getBackground().setAlpha(150);
        //设置宽和高
        setWidth(LayoutParams.MATCH_PARENT);
        setHeight(LayoutParams.MATCH_PARENT);

        setTouchable(true);//这个控制PopupWindow内部控件的点击事件，但是我的项目中没用这个也能点击。
        setFocusable(true);
        //点击外部是否可消去，需要与上面的属性配合使用，都为true可消去，都为false不可消去，也有说法是setOutsideTouchable必须和setBackgroundDrawable同时用才好用，没试过，就都写上了。
        setOutsideTouchable(true);
        //设置透明的颜色背景。以前的那个方法过时了用这个，与下面一个意思就是分开不开写的区别，在这可以设置背景色，也可以在布局里设置背景色
        setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
//         //实例化一个ColorDrawable颜色为半透明
//        ColorDrawable dw = new ColorDrawable(0xb0000000);
//        // 设置弹出窗体的背景
//        this.setBackgroundDrawable(dw);
        //设置动画效果
        this.setAnimationStyle(R.style.popupAnimationTwo);

        initView(view);
        setListener();
    }

进和出的动画效果放在style里

 <style name="popupAnimation" parent="android:Animation">
        <item name="android:windowEnterAnimation">@anim/popup_in</item>
        <item name="android:windowExitAnimation">@anim/popup_out</item>
    </style>

进和出的动画效果放在anim里
进入动画

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

    //移动
    <translate
        android:duration="300"//动画时间
        android:fromYDelta="100%p"//开始位置，p为parent，相对于父类，100%p也就是在最底部
        android:toYDelta="0" />//结束位置，0也就是在最上边
        //透明度
    <alpha
        android:duration="300"
        android:fromAlpha="0.0"//透明度由透明到不透明
        android:toAlpha="1.0" />
</set>

出的动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:duration="300"
        android:fromYDelta="0"
        android:toYDelta="100%p" />
    <alpha
        android:duration="300"
        android:fromAlpha="1.0"
        android:toAlpha="0.0" />
</set>

但是这个做，半透明的背景也会从底部弹出，有动画效果，个人感觉不好看，所以可以这个改，在布局和popupwindow里面背景设置为透明，然后在用到popupwindow的地方用下面的方法

imgPop = new ImagePopupWindow(this);
        imgPop.showAtLocation(mHeadIv, Gravity.CENTER, 0, 0);
        imgPop.setOnPicTypeListener(new ImagePopupWindow.OnPicTypeListener() {
//            @Override
//            public void onCamera() {
//                //ImageChooseUtils.doCameraPhoto(AddColorActivity.this);
////                GalleryFinal.openCamera(1,mOnHanlderResultCallback);
//                photoUtil=new PhotoUtil(PersonalDataActivity.this);
//
//            }

            @Override
            public void onPhoto() {
                GalleryFinal.openGallerySingle(2, mOnHanlderResultCallback);
            }
        });
 backgroundAlpha(0.7f);
        imgPop.setOnDismissListener(new PopupWindow.OnDismissListener() {
            @Override
            public void onDismiss() {
                backgroundAlpha(1f);
            }
        });

/**
     * 设置添加屏幕的背景透明度
     * @param bgAlpha
     */
    public void backgroundAlpha(float bgAlpha)
    {
        WindowManager.LayoutParams lp = getWindow().getAttributes();
        lp.alpha = bgAlpha; //0.0-1.0
        getWindow().setAttributes(lp);
    }

贴一份完整的代码（布局已经有了）

public class SexPopupWindow extends PopupWindow implements OnClickListener {

    public TextView mWoman, mMan, mClance;
    public LinearLayout li;

    public OnSexTypeListener onSexTypeListener;

    public SexPopupWindow(Context context) {
        super(context);

        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View view = inflater.inflate(R.layout.popup_sex, null);

        setContentView(view);
        view.getBackground().setAlpha(150);
        setWidth(LayoutParams.MATCH_PARENT);
        setHeight(LayoutParams.MATCH_PARENT);
        setFocusable(true);
        setOutsideTouchable(true);
        setBackgroundDrawable(new BitmapDrawable());
        this.setAnimationStyle(R.style.popupAnimation);

        initView(view);
        setListener();
    }


    private void initView(View view) {
        mWoman = (TextView)view.findViewById(R.id.woman_tv);
        mMan = (TextView)view.findViewById(R.id.man_tv);
        mClance = (TextView)view.findViewById(R.id.cancle_tv);
        li = (LinearLayout)view.findViewById(R.id.popup_linear);
    }

    private void setListener() {
        mWoman.setOnClickListener(this);
        mMan.setOnClickListener(this);
        mClance.setOnClickListener(this);
        li.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.woman_tv:
                onSexTypeListener.onWoman();
                dismiss();
                break;
            case R.id.man_tv:
                onSexTypeListener.onMan();
                dismiss();
                break;
            case R.id.cancle_tv:
                dismiss();
                break;
            case R.id.popup_linear:
                dismiss();
                break;
        }
    }

    public void setOnSexTypeListener(OnSexTypeListener l){
        onSexTypeListener = l;
    }

    public interface OnSexTypeListener {
        void onWoman();
        void onMan();
    }

}

sexPop = new SexPopupWindow(this);
                sexPop.showAtLocation(mHeadIv, Gravity.CENTER, 0, 0);
                sexPop.setOnSexTypeListener(new SexPopupWindow.OnSexTypeListener() {
                    @Override
                    public void onWoman() {
                        mSexTv.setText("女性");
                    }

                    @Override
                    public void onMan() {
                        mSexTv.setText("男性");
                    }
                });