「这是我参与11月更文挑战的第4天，活动详情查看：[2021最后一次更文挑战](https://juejin.cn/post/7023643374569816095 "https://juejin.cn/post/7023643374569816095")」在没有对接支付时，利用收款码曲线救国，现在有个需求，点击支付弹出底部弹窗，选择支付类型，弹出对应的收款码。（举个例子哈）那就封装起来吧既然是弹窗不妨就用`PopupWindow`实现 # 首先new一个类继承于`PopupWindow` ```java public class IosPopupWindow extends PopupWindow ``` # 接着定义变量 ```java private String PaymentCodeTitle;//弹窗的标题 //支付的类型 private int PAY_TYPE_Alipay = 0; private int PAY_TYPE_WeChat = 1; private Activity mActivity; private View dialogView; private String dialogMessage = null; ``` 仿ios布局效果\ `ios_popup_window_layout.xml` ```xml ``` 白色圆角效果 `popup_shape.xml` 此文件放在drawable文件夹下 ```xml ``` 实现构造函数，传入Activity和点击接口并在里面设置布局和各个属性 ```java public IosPopupWindow(Activity context, OnClickListener itemsOnClick) { this.mActivity = context; mOnClickListener = itemsOnClick; View view = LayoutInflater.from(context).inflate(R.layout.ios_popup_window_layout, null); setContentView(view); setWidth( RelativeLayout.LayoutParams.MATCH_PARENT); setHeight( RelativeLayout.LayoutParams.WRAP_CONTENT); //设置背景,这个没什么效果，不添加会报错 setBackgroundDrawable(new BitmapDrawable()); //设置点击弹窗外隐藏自身 setFocusable(true); setOutsideTouchable(true); //设置动画 setAnimationStyle(R.style.ios_PopupWindow); //设置消失监听 setOnDismissListener(new PopupWindow.OnDismissListener() { @Override public void onDismiss() { dismissPopupWindow(); } }); //设置PopupWindow的View点击事件 setOnPopupViewClick(view); //设置背景色 setBackgroundAlpha(0.5f); } ``` # 弹出 Gravity.BOTTOM表示显示在底部 ```java public void show(View parentView){ //设置位置 showAtLocation(parentView, Gravity.BOTTOM, 0, 66); } ``` 设置屏幕背景透明效果 ```java public void setBackgroundAlpha(float alpha) { WindowManager.LayoutParams lp = mActivity.getWindow().getAttributes(); lp.alpha = alpha; mActivity.getWindow().setAttributes(lp); } ``` ``` /** * ios弹窗点击事件 * * @param view */ private void setOnPopupViewClick(View view) { dialogView = LayoutInflater.from(mActivity).inflate(R.layout.dialog_payment_qr_code_layout,null); ImageView iv =dialogView.findViewById(R.id.iv_payment_code); TextView tv_Alipay, tv_WeChat, tv_cancel; /** * 支付宝支付 */ tv_Alipay = (TextView) view.findViewById(R.id.tv_Alipay); tv_Alipay.setOnClickListener(v -> { dismissPopupWindow(); PaymentCodeTitle ="支付宝支付"; showPaymentCode(PAY_TYPE_Alipay); }); /** * 微信支付 */ tv_WeChat = (TextView) view.findViewById(R.id.tv_WeChat); tv_WeChat.setOnClickListener(v -> { dismissPopupWindow(); PaymentCodeTitle ="微信支付"; showPaymentCode(PAY_TYPE_WeChat); }); tv_cancel = (TextView) view.findViewById(R.id.tv_cancel); tv_cancel.setOnClickListener(v -> { //取消 dismissPopupWindow(); mOnClickListener.cancel(); }); } ``` 弹窗点击接口 ```java private OnClickListener mOnClickListener; public void setPopupOnClickListener(OnClickListener mPopupOnClickListener){ this.mOnClickListener = mPopupOnClickListener; } public interface OnClickListener{ void alipayOnClick();//Alipay void weChatOnClick();//WeChat void cancel();//取消 } ``` 点击支付类型之后就弹出二维码我们用`AlertDialog.Builder`加自定义布局实现 `dialogView`就是开头定义的变量创建布局，內部实际上就是view.addView()实现的 ```java dialogView = LayoutInflater.from(mActivity).inflate(R.layout.dialog_payment_qr_code_layout,null); ``` 接着在DialogBuilder里面设置视图 ```java alertDialogBuilder.setView(dialogView) ``` 全部代码 `dialog_payment_qr_code_layout.xml` ```xml ``` ```java /** * show二维码 */ private void showPaymentCode(int PayType){ dialogView = LayoutInflater.from(mActivity).inflate(R.layout.dialog_payment_qr_code_layout,null); //获取ImageView用来显示二维码 ImageView iv =dialogView.findViewById(R.id.iv_payment_code); if (PayType==PAY_TYPE_Alipay){ iv.setImageBitmap({你的Alipay码}); } else if (PayType==PAY_TYPE_WeChat){ iv.setImageBitmap({你的WeChat码}); } AlertDialog.Builder alertDialogBuilder = new MaterialAlertDialogBuilder(mActivity) .setView(dialogView) .setTitle(PaymentCodeTitle)//标题 .setMessage(dialogMessage)//副标题 .setPositiveButton( "确定",new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { if (PayType==PAY_TYPE_Alipay){ mOnClickListener.alipayOnClick(); }else { mOnClickListener.weChatOnClick(); } } }) .setNegativeButton("取消",null); alertDialogBuilder .show(); } ``` 设置二维码的弹窗副标题可以用来设置金额 ```java public void setDialogMessage(String mag){ this.dialogMessage = mag; } ``` # 最后还有PopupWindow销毁弹窗还要把背景颜色换回来 ```java private void dismissPopupWindow() { dismiss(); setBackgroundAlpha(1f); } ``` # 调用方法 ``` IosPopupWindow mPopupWindow = new IosPopupWindow(getActivity(), new IosPopupWindow.OnClickListener() { @Override public void alipayOnClick() { //弹出alipay码 } @Override public void weChatOnClick() { //弹出weChat码 } @Override public void cancel() { //取消 } }); mPopupWindow.setDialogMessage("点个赞吧"); mPopupWindow.show(v); ``` 不放图的一律当水贴处理 ![IMG_20211116_233842.jpg](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/4d6983f1d74d4214bf23b919772cd727~tplv-k3u1fbpfcp-watermark.image?) ![1637077548211.png](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/f1fc7e69cb6b4d01b6904991273580d2~tplv-k3u1fbpfcp-watermark.image?)