依照產品需求當用戶輸入手機號,銀行卡是能自動格式化(添加分隔符),方便用戶輸入、閱讀;同時手機號輸入不能超過11位,銀行卡不超過19位;
依照產品的需求定制一個簡單的EditText,基于系統EditText 擴展一個自己的控件;
先上最后的效果,圖片太大加載不出來,壓縮了一下有點丟幀:
edittext.gif
- 既然是基于EditText 擴展,那就直接繼承系統控件,同時要支持輸入手機號、銀行卡,那就需要自定義輸入框的類型,這里自定義枚舉類型
<declare-styleable name="PatternEditText">
<attr name="Format_Type" format="enum">
<enum name="mobile_phone" value="1"/>
<enum name="bank_card" value="2"/>
</attr>
</declare-styleable>
那么在控件初始化的時候讀取XML中配置的屬性,就可以更加不同的類型,在不同的位置分隔;
企業微信截圖_15525508201553.png
public class PatternEditText extends android.support.v7.widget.AppCompatEditText {
public PatternEditText(Context context) {
this(context, null);
}
public PatternEditText(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public PatternEditText(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
TypedArray typedArray = context.getTheme().obtainStyledAttributes(attrs, R.styleable.PatternEditText, defStyleAttr, 0);
inputType = typedArray.getString(R.styleable.PatternEditText_Format_Type);//讀取配置的類型
typedArray.recycle();
init();
}
}
2.初始化一些基本的屬性,設置只可以輸入數字
private void init() {
shouldStopChange = false;
setInputType(InputType.TYPE_CLASS_NUMBER);
setFocusable(true);
setEnabled(true);
setFocusableInTouchMode(true);
setCursorVisible(true);
addTextChangedListener(watcher);
}
3.格式化(插入分隔符)可以在用戶輸入后,可以對改控件添加addTextChangedListener監聽,在afterTextChanged中處理,邏輯很簡單,直接貼代碼了:
private TextWatcher watcher = new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
@Override
public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
@Override
public void afterTextChanged(Editable editable) {
format();
}
};
private void format() {
if (!TextUtils.isEmpty(getText().toString())){
String value = getText().toString();
if (!TextUtils.isEmpty(value) && value.length() > inputMaxLength){
value = value.substring(0, inputMaxLength);
}
if (shouldStopChange) {
shouldStopChange = false;
return;
}
shouldStopChange = true;
StringBuffer inputValue = new StringBuffer(value);
int selectionStart = getSelectionStart();
for (int i = 0; i < inputValue.length(); i++) {
char charAt = inputValue.charAt(i);
if (charAt == WHITE_SPACE) {
inputValue.delete(i, i + 1);
if (i < selectionStart) {
selectionStart--;
}
i--;
} else if ((i-fristWhiteSpacePosition) % white_space_step == 0) {
inputValue.insert(i, WHITE_SPACE);
if (i < selectionStart) {
selectionStart++;
}
}
}
setText(inputValue);
setSelection(Math.min(inputValue.length(), selectionStart));
}
}
邏輯比較簡單,總共就100行代碼,統一整理如下:
import android.content.Context;
import android.content.res.TypedArray;
import android.text.Editable;
import android.text.InputType;
import android.text.TextUtils;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.view.KeyEvent;
import android.view.View;
import com.dachuan.R;
/**
* Created by admin on 2019/3/13.
*/
public class PatternEditText extends android.support.v7.widget.AppCompatEditText {
private String inputType = "1";//默認手機格式
private static final char WHITE_SPACE = ' ';//空格
private boolean shouldStopChange = false;
private int inputMaxLength;
private int phoneLength = 11;//手機號碼長度
private int phoneFristSpacePosition = 3;//手機號第一個空格位置
private int bankNumLength = 19;//銀行卡最大長度
private int bankNumFristSpacePosition = 4;//銀行卡第一個空格位置
private int white_space_step = 5;//空格間隔
private int fristWhiteSpacePosition;
public PatternEditText(Context context) {
this(context, null);
}
public PatternEditText(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public PatternEditText(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
TypedArray typedArray = context.getTheme().obtainStyledAttributes(attrs, R.styleable.PatternEditText, defStyleAttr, 0);
inputType = typedArray.getString(R.styleable.PatternEditText_Format_Type);
typedArray.recycle();
init();
}
private void init() {
shouldStopChange = false;
setInputType(InputType.TYPE_CLASS_NUMBER);
setFocusable(true);
setEnabled(true);
setFocusableInTouchMode(true);
setCursorVisible(true);
addTextChangedListener(watcher);
initInputType();
format();
}
private void initInputType() {
if ("1".equals(inputType)){
inputMaxLength = phoneLength + 2;
fristWhiteSpacePosition = phoneFristSpacePosition;
}else {
inputMaxLength = bankNumLength + 4;
fristWhiteSpacePosition = bankNumFristSpacePosition;
}
}
private TextWatcher watcher = new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
@Override
public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
@Override
public void afterTextChanged(Editable editable) {
format();
}
};
private void format() {
if (!TextUtils.isEmpty(getText().toString())){
String value = getText().toString();
if (!TextUtils.isEmpty(value) && value.length() > inputMaxLength){
value = value.substring(0, inputMaxLength);
}
if (shouldStopChange) {
shouldStopChange = false;
return;
}
shouldStopChange = true;
StringBuffer inputValue = new StringBuffer(value);
int selectionStart = getSelectionStart();
for (int i = 0; i < inputValue.length(); i++) {
char charAt = inputValue.charAt(i);
if (charAt == WHITE_SPACE) {
inputValue.delete(i, i + 1);
if (i < selectionStart) {
selectionStart--;
}
i--;
} else if ((i-fristWhiteSpacePosition) % white_space_step == 0) {
inputValue.insert(i, WHITE_SPACE);
if (i < selectionStart) {
selectionStart++;
}
}
}
setText(inputValue);
setSelection(Math.min(inputValue.length(), selectionStart));
}
}
}