1.概述   

      Android自定義密碼輸入框，通過自定義輸入顯示框和自定義輸入鍵盤，實現仿支付寶數字鍵盤等。程式碼已託管到github，有需要的話可以去我的github下載。

可以自定義關閉圖示、文字內容、顏色、大小，彈框樣式等。

先看效果圖：

2．效果實現

 2.1. 拆分控制元件之標題欄

包含一個關閉按鈕，和一個標題文字，就是一個簡單的ImageView和TextView，圖示和文字(顏色、大小)可根據自己需求更改，呼叫如下方法等：

/**
 * 關閉圖片
 * 
 */
public void setCloseImgView(int resId) {
  mImageViewClose.setImageResource(resId);
}
/**
 * 設定標題的文字
 */
public void setHintText(String text) {
    mTvHint.setText(text);
}
 

 2.2. 拆分控制元件之純數字輸入框

我使用的LinearLayout佈局進行水平方向權重分配的6個TextView，邊線使用的view1dp背景和忘記密碼也是文字TextView

 2.3. 拆分控制元件之9宮格數字鍵盤

這裡是4*3的就宮格佈局，我採用的是GridView進行放置的TextView按鈕。

（1）0-9數字設定selector，實現點選變色效果，ClickListener進行密碼輸入；

（2）左下角空白文字，為了美觀並無用處；

（3）刪除使用的背景圖片，通過TouchListener事件來實現點選切換效果圖。ClickListener

（4）邏輯處理：

使用的strPass字串儲存密碼，根據情況進行清除、新增等。當密碼==6位是回撥onPassFinish方法進行伺服器驗證

//0-9按鈕
if (position < 11 &&position!=9) {
     if(strPass.length()==6){
         return;
     }
     else {
         strPass=strPass+listNumber.get(position);//得到當前數字並累加
         mTvPass[strPass.length()-1].setText("*"); //設定介面*
         //輸入完成
         if(strPass.length()==6){
                mPayClickListener.onPassFinish(strPass);//請求伺服器驗證密碼
         }
     }
}
//刪除按鈕
else if(position == 11) {
    if(strPass.length()>0){
        mTvPass[strPass.length()-1].setText("");//去掉介面*
        strPass=strPass.substring(0,strPass.length()-1);//刪除一位
    }
}
//空按鈕
if(position==9){
}
 

 2.4. 拆分控制元件之與彈框組合

方式一：預設系統配置

    private void payDialog() {
     final PayPassDialog dialog=new PayPassDialog(this);
      dialog.getPayViewPass()
            .setPayClickListener(new PayPassView.OnPayClickListener() {
               @Override
               public void onPassFinish(String passContent) {
                   //6位輸入完成,回撥
               }
               @Override
               public void onPayClose() {
                 dialog.dismiss();
                   //關閉回撥
               }

               @Override
               public void onPayForget() {
                dialog.dismiss();
                  //點選忘記密碼回撥
               }
            });
    }

方式二：自定義配置(更多方法請到github檢視)

new PayPassDialog(this,自定義主題樣式);
setWindowSize==彈框寬高
setGravity==動畫與位置
getPayViewPass==得到組合控制元件
setCloseImgView==關閉圖片設定
setForgetText==忘記文字設定

private void payDia() {
  final PayPassDialog dialog=new PayPassDialog(this,R.style.dialog_gray);
        //彈框自定義配置
        dialog.setAlertDialog(false)
                .setWindowSize(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT,0.4f)
                .setOutColse(false)
                .setGravity(R.style.teamTypeAnimation, Gravity.BOTTOM);
        //組合控制元件自定義配置
        PayPassView payView=dialog.getPayViewPass();
        payView.setForgetText("忘記密碼?");
        payView.setForgetColor(getResources().getColor(R.color.blue3bafd9));
        payView.setForgetSize(16);
        payView.setPayClickListener(new PayPassView.OnPayClickListener() {
            @Override
            public void onPassFinish(String passContent) {
                //6位輸入完成回撥
            }
            @Override
            public void onPayClose() {
                dialog.dismiss();
                //關閉回撥
            }
            @Override
            public void onPayForget() {
                dialog.dismiss();
                //忘記密碼回撥
            }
        });
    }

3．最後

    更多配置方法請到github檢視詳情，引入:  implementation 'com.github.lzjin:AlipayPassDialog:1.1'  即可使用。

純手工寫，各位看官如果本文對你有幫助請點個贊吧。github地址：https://github.com/lzjin/AlipayPassDialog