Android仿支付宝支付页面效果 popupwindow弹出阴影效果 checkBox单选按钮选择效果

一、效果图：

二、具体实现步骤：

１.自定义popupWindow

package com.wallet.newnetclient.ui.widget;

import android.app.Activity;
import android.content.Context;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.WindowManager;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.PopupWindow;
import android.widget.TextView;
import android.widget.Toast;

import com.wallet.newnetclient.R;
import com.wallet.newnetclient.adapter.SelectBankListAdapter;
import com.wallet.newnetclient.utils.AESCoderUtils;
import com.wallet.newnetclient.utils.DensityUtils;
import com.wallet.newnetclient.utils.PayUtils;
import com.wallet.newnetclient.yeepay.ProgressSubscriber;
import com.wallet.newnetclient.yeepay.SubscriberOnNextListener;
import com.wallet.newnetclient.yeepay.YeeMethods;
import com.wallet.newnetclient.yeepay.YeepayRetrofit;
import com.wallet.newnetclient.yeepay.yeebean.BankCardList;

import java.util.ArrayList;
import java.util.List;

/**
 * Created by ${Gxinyu} on 2017/4/15.
 */

public class PayPopupWindow extends PopupWindow implements View.OnClickListener {
    private View conentView;
    private Activity mContext;
    private Button btn_confirm_pay;
    private TextView newPayWay;
    private ImageView btn_close_popupwindow;
    private RecyclerView recyclerView;
    private LinearLayout llNullBankCard;
    private List<BankCardList.CardListBean> cardList = new ArrayList<>();
    private LinearLayoutManager linearLayoutManager;
    private SelectBankListAdapter selectBankListAdapter;
    private int witchBankSelect = 0;//选中那张银行卡
    private String mTradingId;//请求商品订单号
    private String baseUrl;
    private int paytype;

    public PayPopupWindow(final Activity context, String tradingId, int payType) throws Exception {
        mContext = context;
        mTradingId = tradingId;
        paytype=payType;
        baseUrl = PayUtils.getPayUrlByType(payType);
        LayoutInflater inflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        conentView = inflater.inflate(R.layout.pay_popu_window, null);
        int width = context.getWindowManager().getDefaultDisplay().getWidth();
        // 设置SelectPicPopupWindow的View
        this.setContentView(conentView);
        // 设置SelectPicPopupWindow弹出窗体的宽
        this.setWidth(width);
        // 设置SelectPicPopupWindow弹出窗体的高
        this.setHeight(DensityUtils.dip2px(mContext, 440));
        // 设置SelectPicPopupWindow弹出窗体可点击
        this.setFocusable(true);
        this.setOutsideTouchable(true);
        // 刷新状态
        this.update();
        //显示popular
        initPopupWindowView();
        initListener();
    }

    /**
     * 显示popupWindow
     *
     * @param parent
     */
    public void showPopupWindow(View parent) {
        if (!this.isShowing()) {
            // 以下拉方式显示popupwindow
            this.showAtLocation(parent, Gravity.BOTTOM | Gravity.CENTER_HORIZONTAL, 0, 0);
        } else {
            this.dismiss();
        }
    }

    @Override
    public void setOnDismissListener(OnDismissListener onDismissListener) {
        super.setOnDismissListener(onDismissListener);
        if(isShowing()) {
            WindowManager.LayoutParams lp = mContext.getWindow().getAttributes();
            lp.alpha = 0.4f;
            mContext.getWindow().addFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);
            mContext.getWindow().setAttributes(lp);
        }
    }

    public void initPopupWindowView() throws Exception {
        btn_confirm_pay = (Button) conentView.findViewById(R.id.btn_confirm_pay);
        newPayWay = (TextView) conentView.findViewById(R.id.tv_select_new_pay);
        btn_close_popupwindow = (ImageView) conentView.findViewById(R.id.btn_close_popupwindow);
        recyclerView = (RecyclerView) conentView.findViewById(R.id.bank_card_list_recyclerview);
        llNullBankCard = (LinearLayout) conentView.findViewById(R.id.ll_null_bank_card);
        linearLayoutManager = new FullyLinearLayoutManager(mContext, LinearLayoutManager.VERTICAL, false);
        recyclerView.setLayoutManager(linearLayoutManager);
        recyclerView.addItemDecoration(new RecyclerViewLinearDivider(mContext, RecyclerViewLinearDivider.VERTICAL_LIST, 3));
        //获取数据并设置数据
        getBindBnakCardList();
    }


    private void initListener() {
        btn_confirm_pay.setOnClickListener(this);
        newPayWay.setOnClickListener(this);
        btn_close_popupwindow.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            //确认支付按钮
            case R.id.btn_confirm_pay:
                try {
                    gotoPay();
                } catch (Exception e) {
                    e.printStackTrace();
                }
                break;
            case R.id.tv_select_new_pay:
                try {
                    selectNewPay();
                } catch (Exception e) {
                    e.printStackTrace();
                }
                break;
            case R.id.btn_close_popupwindow:
                this.dismiss();
                break;
        }
    }

    /**
     * 选择新卡支付
     */
    private void selectNewPay() throws Exception {
        YeeMethods.addBankCard(mContext);
    }

    /**
     * 去支付
     */
    private void gotoPay() throws Exception {
        //如果没有只能通过添加新方式支付
        if (cardList.size() == 0) {
            Toast.makeText(mContext, "请选择新卡支付", Toast.LENGTH_SHORT).show();
        } else {
            //选择选中的那个去支付
            for (int i = 0; i < cardList.size(); i++) {
                if (cardList.get(i).isChecked()) {
                    witchBankSelect = i;
                }
            }
            YeeBoPay(cardList.get(witchBankSelect));
        }
    }

    /**

       支付接口
     * @param cardListBean
     */
    private void YeeBoPay(BankCardList.CardListBean cardListBean) throws Exception {
        YeeMethods.yeeOrderPay(paytype,yeePay,mContext);
    }

    /**
     * 获取银行卡列表接口
     */
    public void getBindBnakCardList() throws Exception {
        YeepayRetrofit.getInstance().getBankCardList(new ProgressSubscriber<BankCardList>(new SubscriberOnNextListener<BankCardList>() {
            @Override
            public void onNext(BankCardList bankCardList) {
                cardList = bankCardList.getCardList();
                if (cardList == null || cardList.size() == 0) {
                    //没有绑定的银行卡呢
                    Toast.makeText(mContext, "没有绑定的银行卡呢", Toast.LENGTH_SHORT);
                } else {
                    for (int i = 0; i < cardList.size(); i++) {
                        if (i == 0) {
                            cardList.get(i).setChecked(true);
                        } else {
                            cardList.get(i).setChecked(false);
                        }
                    }
                    //设置适配器
                    selectBankListAdapter = new SelectBankListAdapter(mContext, cardList, recyclerView);
                    recyclerView.setAdapter(selectBankListAdapter);
                }
            }
        }, mContext));
    }
}

2.PayActivty支付类：

payMobile()支付方法，在支付按钮的点击事件中调用

    private void payMobile(){
        if(addPopWindow ==null) {
            addPopWindow = new PayPopupWindow(this,mobilePayBean.getTradingId(),Constants.ORDER_PAYMENT_TYPE_MOBILE);
        }
        //设置popupWindow弹出窗体的背景
        addPopWindow.setBackgroundDrawable(new BitmapDrawable(null, ""));
        addPopWindow.showPopupWindow(btnPayMobile);
        addPopWindow.setOnDismissListener(new PopupWindow.OnDismissListener() {
            @Override
            public void onDismiss() {
                recoveryAlpha();
            }
        });
        if(addPopWindow.isShowing()) {
            // 产生背景变暗效果
            WindowManager.LayoutParams lp = this.getWindow()
                    .getAttributes();
            lp.alpha = 0.4f;
            this.getWindow().addFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);
            this.getWindow().setAttributes(lp);
        }
    }

    private void recoveryAlpha() {
        WindowManager.LayoutParams lp = this.getWindow().getAttributes();
        lp.alpha = 1f;
        getWindow().addFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);
        getWindow().setAttributes(lp);

    }

    @Override
    protected void onPause() {
        super.onPause();
        if (addPopWindow != null) {
            addPopWindow.dismiss();
            addPopWindow = null;
        }
    }

    @Override
    protected void onDestroy() {
        if (addPopWindow != null) {
            addPopWindow.dismiss();
            addPopWindow = null;
        }
        super.onDestroy();
    }

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="440dp"
    android:background="@color/n_248_248_248"
    android:orientation="vertical">

    <LinearLayout
        android:id="@+id/ll_selected_way_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/n_255_255_255"
        android:orientation="horizontal"
        android:paddingBottom="15dp"
        android:paddingLeft="13dp"
        android:paddingRight="13dp"
        android:paddingTop="15dp">

        <ImageView
            android:id="@+id/btn_close_popupwindow"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@mipmap/gray_close_btn" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center_horizontal"
            android:text="@string/text_select_pay_way"
            android:textColor="@color/n_0_0_0"
            android:textSize="16sp" />
    </LinearLayout>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/bank_card_list_recyclerview"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginTop="1dp"
        android:layout_weight="1"
        android:scrollbars="none" />

    <LinearLayout
        android:visibility="gone"
        android:id="@+id/ll_null_bank_card"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:layout_weight="1">

        <ImageView
            android:id="@+id/iv_null_bank_card"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginTop="40dp"
            android:background="@mipmap/iv_bank_nocards" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:layout_marginTop="9dp"
            android:text="@string/tv_bank_nocard"
            android:textColor="@color/n_204_204_204"
            android:textSize="12sp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@+id/btn_confirm_pay"
        android:layout_marginBottom="20dp"
        android:background="@color/n_255_255_255"
        android:orientation="horizontal"
        android:paddingBottom="15dp"
        android:paddingTop="15dp">

        <TextView
            android:id="@+id/tv_select_new_pay"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="13dp"
            android:layout_weight="1"
            android:text="@string/text_newcard_pay" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_marginRight="13dp"
            android:background="@mipmap/ic_goin" />
    </LinearLayout>

    <Button
        android:id="@+id/btn_confirm_pay"
        android:layout_width="match_parent"
        android:layout_height="51dp"
        android:layout_alignParentBottom="true"
        android:layout_margin="13dp"
        android:layout_marginBottom="27dp"
        android:layout_marginTop="20dp"
        android:background="@drawable/shape_blue_background"
        android:gravity="center"
        android:text="@string/text_immediate_payment"
        android:textColor="@color/n_255_255_255"
        android:textSize="18sp" />
</LinearLayout>