Android自定義控件實現通用驗證碼輸入框

<?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="match_parent"
 android:orientation="vertical">

 <TextView
  android:id="@+id/number_tv"
  style="@style/TextStyleMain"
  android:layout_width="match_parent"
  android:layout_height="0mm"
  android:layout_weight="1"
  android:maxLength="1"
  android:text="0"
  android:textSize="72mm" />

 <View
  android:id="@+id/split_v"
  android:layout_width="match_parent"
  android:layout_height="1mm"
  android:background="@color/colorMain" />

</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>
<resources>

 <!-- 自定義驗證碼輸入框 屬性 -->
 <declare-styleable name="AuthCodeInputView">
  <!-- 當前輸入位分割線顏色 -->
  <attr name="currentSplitLineColor"
   format="reference|color" />
  <!-- 其他輸入位分割線顏色 -->
  <attr name="otherSplitLineColor"
   format="reference|color" />
  <!-- 分割線高度 -->
  <attr name="splitLineHeight"
   format="dimension" />
  <!-- 驗證碼位數 -->
  <attr name="digit"
   format="integer" />
  <!-- 單個驗證碼寬度 -->
  <attr name="singleCaptchaWidth"
   format="dimension" />
  <!-- 驗證碼當前輸入位字體顏色 -->
  <attr name="currentTextColor"
   format="reference|color" />
  <!-- 驗證碼當前輸入位字體大小 -->
  <attr name="currentTextSize"
   format="dimension" />
  <!-- 驗證碼其他輸入位字體顏色 -->
  <attr name="otherTextColor"
   format="reference|color" />
  <!-- 驗證碼其它輸入位字體大小 -->
  <attr name="otherTextSize"
   format="dimension" />
  <!-- 默認顏色 -->
  <attr name="defaultColor"
   format="reference|color" />
  <!-- 默認字體大小 -->
  <attr name="defaultTextSize"
   format="dimension" />
  <!-- 默認間距 -->
  <attr name="defaultSpacing"
   format="dimension" />
 </declare-styleable>

</resources>

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Color;
import android.os.Build;
import android.text.TextUtils;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.TextView;

import androidx.annotation.ColorInt;
import androidx.annotation.RequiresApi;

/**
 * <pre>
 *  <b>author</b> ：BraveTou
 *  <b>blog</b>  ：https://blog.csdn.net/bravetou
 *  <b>time</b>  ：2020/9/4 16:43
 *  <b>desc</b>  ：<pre>
 *   自定義驗證碼輸入框
 *  </pre>
 * </pre>
 */
public class AuthCodeInputView extends LinearLayout {
 // <!-- 默認間距 -->
 private int mDefaultSpacing = 16;
 // <!-- 默認顏色 -->
 @ColorInt
 private int mDefaultColor = Color.BLACK;
 // <!-- 默認字體大小 -->
 private int mDefaultTextSize = 36;
 // <!-- 當前輸入位分割線顏色 -->
 @ColorInt
 private int mCurrentSplitLineColor = mDefaultColor;
 // <!-- 其他輸入位分割線顏色 -->
 @ColorInt
 private int mOtherSplitLineColor = mDefaultColor;
 // <!-- 分割線高度 -->
 private int mSplitLineHeight = 1;
 // <!-- 驗證碼位數 -->
 private int mDigit = 4;
 // <!-- 單個驗證碼寬度 -->
 private int mSingleCaptchaWidth = 100;
 // <!-- 驗證碼當前輸入位字體顏色 -->
 @ColorInt
 private int mCurrentTextColor = mDefaultColor;
 // <!-- 驗證碼當前輸入位字體大小 -->
 private int mCurrentTextSize = mDefaultTextSize;
 // <!-- 驗證碼其他輸入位字體顏色 -->
 @ColorInt
 private int mOtherTextColor = mDefaultColor;
 // <!-- 驗證碼其它輸入位字體大小 -->
 private int mOtherTextSize = mDefaultTextSize;

 // 記錄當前輸入文本
 private String mText = "";

 public AuthCodeInputView(Context context) {
  super(context);
  init(context, null);
 }

 public AuthCodeInputView(Context context, AttributeSet attrs) {
  super(context, attrs);
  init(context, attrs);
 }

 public AuthCodeInputView(Context context, AttributeSet attrs, int defStyleAttr) {
  super(context, attrs, defStyleAttr);
  init(context, attrs);
 }

 @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
 public AuthCodeInputView(Context context, AttributeSet attrs, int defStyleAttr,
        int defStyleRes) {
  super(context, attrs, defStyleAttr, defStyleRes);
  init(context, attrs);
 }

 // 初始化
 private void init(Context context, AttributeSet attrs) {
  setOrientation(LinearLayout.HORIZONTAL);
  setGravity(Gravity.CENTER);
  if (getChildCount() > 0) {
   removeAllViews();
  }
  initAttrs(context, attrs);
  if (mDigit <= 0) {
   return;
  }
  for (int i = 0; i < mDigit; i++) {
   // 實例化 ITEM 組件
   View child = LayoutInflater.from(context).inflate(
     R.layout.view_auth_code_input_item, this, false);
   LayoutParams lp = new LayoutParams(mSingleCaptchaWidth,
     ViewGroup.LayoutParams.MATCH_PARENT);
   if (i != 0) {
    lp.leftMargin = mDefaultSpacing;
   }
   child.setLayoutParams(lp);
   setViewAttrs(child, null, false);
   // 分割線高度隻在初始化時設置一次
   View mSplitV = child.findViewById(R.id.split_v);
   LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
     ViewGroup.LayoutParams.MATCH_PARENT, mSplitLineHeight);
   mSplitV.setLayoutParams(params);
   addView(child);
  }
 }

 // 設置（未）選中屬性
 private void setViewAttrs(View child, String text, boolean isSelected) {
  TextView mNumberTv = child.findViewById(R.id.number_tv);
  View mSplitV = child.findViewById(R.id.split_v);
  if (isSelected) {
   mNumberTv.setTextColor(mCurrentTextColor);
   mNumberTv.setTextSize(TypedValue.COMPLEX_UNIT_PX, mCurrentTextSize);
   mSplitV.setBackgroundColor(mCurrentSplitLineColor);
  } else {
   mNumberTv.setTextColor(mOtherTextColor);
   mNumberTv.setTextSize(TypedValue.COMPLEX_UNIT_PX, mOtherTextSize);
   mSplitV.setBackgroundColor(mOtherSplitLineColor);
  }
  mNumberTv.setText(TextUtils.isEmpty(text) ? "" : text);
 }

 // 初始化屬性
 private void initAttrs(Context context, AttributeSet attrs) {
  if (null != attrs) {
   // AttributeSet 屬性值的索引
   TypedArray o = context.obtainStyledAttributes(attrs, R.styleable.AuthCodeInputView);
   // 默認間距
   mDefaultSpacing = (int) o.getDimension(R.styleable.AuthCodeInputView_defaultSpacing,
     16f);
   // 獲取默認顏色
   mDefaultColor = o.getColor(R.styleable.AuthCodeInputView_defaultColor, Color.BLACK);
   // 獲取默認字體大小
   mDefaultTextSize = (int) o.getDimension(R.styleable.AuthCodeInputView_defaultTextSize
     , 36f);
   // 輸入位分割線顏色
   mCurrentSplitLineColor =
     o.getColor(R.styleable.AuthCodeInputView_currentSplitLineColor, mDefaultColor);
   // 其他輸入位分割線顏色
   mOtherSplitLineColor = o.getColor(R.styleable.AuthCodeInputView_otherSplitLineColor,
     mDefaultColor);
   // 分割線高度
   mSplitLineHeight = (int) o.getDimension(R.styleable.AuthCodeInputView_splitLineHeight
     , 1f);
   mSplitLineHeight = mSplitLineHeight <= 1 ? 1 : mSplitLineHeight;
   // 驗證碼位數
   mDigit = o.getInteger(R.styleable.AuthCodeInputView_digit, 4);
   // 單個驗證碼寬度
   mSingleCaptchaWidth =
     (int) o.getDimension(R.styleable.AuthCodeInputView_singleCaptchaWidth, 100f);
   // 驗證碼當前輸入位字體顏色
   mCurrentTextColor = o.getColor(R.styleable.AuthCodeInputView_currentTextColor,
     mDefaultColor);
   // 驗證碼當前輸入位字體大小
   mCurrentTextSize = (int) o.getDimension(R.styleable.AuthCodeInputView_currentTextSize
     , mDefaultTextSize);
   // 驗證碼其他輸入位字體顏色
   mOtherTextColor = o.getColor(R.styleable.AuthCodeInputView_otherTextColor,
     mDefaultColor);
   // 驗證碼其它輸入位字體大小
   mOtherTextSize = (int) o.getDimension(R.styleable.AuthCodeInputView_otherTextSize,
     mDefaultTextSize);
   // 回收資源
   o.recycle();
  }
 }

 // 追加文本
 public void addText(String text) {
  text = TextUtils.isEmpty(text) ? "" : text;
  setText(mText + text);
 }

 // 刪除文本
 public void delText() {
  int count = TextUtils.isEmpty(mText) ? 0 : mText.length();
  if (count > 0) {
   setText(mText.substring(0, count - 1));
  } else {
   setText("");
  }
 }

 // 設置文本
 public void setText(String text) {
  text = text.trim();
  int length = TextUtils.isEmpty(text) ? 0 : text.length();
  if (length > mDigit) {
   this.mText = text.substring(0, mDigit);
   length = mDigit;
  } else {
   this.mText = length > 0 ? text : "";
  }
  int count = getChildCount();
  for (int i = 0; i < count; i++) {
   View child = getChildAt(i);
   if (i + 1 < length) {
    setViewAttrs(child, String.valueOf(text.charAt(i)), false);
   } else if (i + 1 == length) {
    setViewAttrs(child, String.valueOf(text.charAt(i)), true);
   } else {
    setViewAttrs(child, null, false);
   }
  }
 }

 // 獲取文本
 public String getText() {
  return mText;
 }
}