Edit text for OTP with Each letter in separate pos

2019-03-15 21:33发布

问题:

Hi I'm working on a application which asks for OTP when user want to reset his password for which I need a text like the one in attached Image... What I thought to proceed with is individual text for each of the letter, All of them arranged in linear layout of horizontal orientation with some margin... and max length as 1 so only one letter can be entered in each editText... Is that a right Approach?? Any Suggestions??

回答1:

You can try this, by making TextWatcher more Generic, so its easy to use and understand

Use below class:

public class GenericTextWatcher implements TextWatcher
    {
        private View view;
        private GenericTextWatcher(View view) 
        {
            this.view = view;
        }

        @Override
        public void afterTextChanged(Editable editable) {
            // TODO Auto-generated method stub
            String text = editable.toString();
            switch(view.getId())
            {

            case R.id.editText1:
                if(text.length()==1)
                    et2.requestFocus(); 
                break;
            case R.id.editText2:
                if(text.length()==1)
                    et3.requestFocus();
                else if(text.length()==0)
                    et1.requestFocus();  
                break;
            case R.id.editText3:
                if(text.length()==1)
                    et4.requestFocus();
                else if(text.length()==0)
                    et2.requestFocus();
                break;
            case R.id.editText4:
                if(text.length()==0)
                    et3.requestFocus();
                break;
            }
        }

        @Override
        public void beforeTextChanged(CharSequence arg0, int arg1, int arg2, int arg3) {
            // TODO Auto-generated method stub
        }

        @Override
        public void onTextChanged(CharSequence arg0, int arg1, int arg2, int arg3) {
            // TODO Auto-generated method stub
        }
    }

How to use above class

et1.addTextChangedListener(new GenericTextWatcher(et1));
et2.addTextChangedListener(new GenericTextWatcher(et2));
et3.addTextChangedListener(new GenericTextWatcher(et3));
et4.addTextChangedListener(new GenericTextWatcher(et4));

Here et1,et2,et3 and et4 are your EditTexts, I know its bad naming convention as per Java Standard, but you can replace it with yours.

P.S You can find the xml design for this here GitHub some other, sample design xml for reference



回答2:

I implemented the following code based on other answers.

I wanted this code to be very simple, optimized and understandable for changes.

Don't use android:maxLength="1" in your xml.

//package your package

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.text.Editable;
import android.text.TextWatcher;
import android.view.KeyEvent;
import android.view.View;
import android.view.inputmethod.InputMethodManager;
import android.widget.EditText;

public class PinActivity extends AppCompatActivity {

    private EditText editText1, editText2, editText3, editText4;
    private EditText[] editTexts;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_pin);

        editText1 = (EditText) findViewById(R.id.otpEdit1);
        editText2 = (EditText) findViewById(R.id.otpEdit2);
        editText3 = (EditText) findViewById(R.id.otpEdit3);
        editText4 = (EditText) findViewById(R.id.otpEdit4);
        editTexts = new EditText[]{editText1, editText2, editText3, editText4};

        editText1.addTextChangedListener(new PinTextWatcher(0));
        editText2.addTextChangedListener(new PinTextWatcher(1));
        editText3.addTextChangedListener(new PinTextWatcher(2));
        editText4.addTextChangedListener(new PinTextWatcher(3));

        editText1.setOnKeyListener(new PinOnKeyListener(0));
        editText2.setOnKeyListener(new PinOnKeyListener(1));
        editText3.setOnKeyListener(new PinOnKeyListener(2));
        editText4.setOnKeyListener(new PinOnKeyListener(3));
    }


    public class PinTextWatcher implements TextWatcher {

        private int currentIndex;
        private boolean isFirst = false, isLast = false;
        private String newTypedString = "";

        PinTextWatcher(int currentIndex) {
            this.currentIndex = currentIndex;

            if (currentIndex == 0)
                this.isFirst = true;
            else if (currentIndex == editTexts.length - 1)
                this.isLast = true;
        }

        @Override
        public void beforeTextChanged(CharSequence s, int start, int count, int after) {

        }

        @Override
        public void onTextChanged(CharSequence s, int start, int before, int count) {
            newTypedString = s.subSequence(start, start + count).toString().trim();
        }

        @Override
        public void afterTextChanged(Editable s) {

            String text = newTypedString;

            /* Detect paste event and set first char */
            if (text.length() > 1)
                text = String.valueOf(text.charAt(0)); // TODO: We can fill out other EditTexts

            editTexts[currentIndex].removeTextChangedListener(this);
            editTexts[currentIndex].setText(text);
            editTexts[currentIndex].setSelection(text.length());
            editTexts[currentIndex].addTextChangedListener(this);

            if (text.length() == 1)
                moveToNext();
            else if (text.length() == 0)
                moveToPrevious();
        }

        private void moveToNext() {
            if (!isLast)
                editTexts[currentIndex + 1].requestFocus();

            if (isAllEditTextsFilled() && isLast) { // isLast is optional
                editTexts[currentIndex].clearFocus();
                hideKeyboard();
            }
        }

        private void moveToPrevious() {
            if (!isFirst)
                editTexts[currentIndex - 1].requestFocus();
        }

        private boolean isAllEditTextsFilled() {
            for (EditText editText : editTexts)
                if (editText.getText().toString().trim().length() == 0)
                    return false;
            return true;
        }

        private void hideKeyboard() {
            if (getCurrentFocus() != null) {
                InputMethodManager inputMethodManager = (InputMethodManager) getSystemService(INPUT_METHOD_SERVICE);
                inputMethodManager.hideSoftInputFromWindow(getCurrentFocus().getWindowToken(), 0);
            }
        }

    }

    public class PinOnKeyListener implements View.OnKeyListener {

        private int currentIndex;

        PinOnKeyListener(int currentIndex) {
            this.currentIndex = currentIndex;
        }

        @Override
        public boolean onKey(View v, int keyCode, KeyEvent event) {
            if (keyCode == KeyEvent.KEYCODE_DEL && event.getAction() == KeyEvent.ACTION_DOWN) {
                if (editTexts[currentIndex].getText().toString().isEmpty() && currentIndex != 0)
                    editTexts[currentIndex - 1].requestFocus();
            }
            return false;
        }

    }

}


回答3:

Use 4 different EditText.Use the below code to change the focus after subsequent entry.

private EditText editText1;
private EditText editText2;
private EditText editText3;
private EditText editText4;

    editText1.addTextChangedListener(new TextWatcher() {

            public void onTextChanged(CharSequence s, int start, int before, int count) {
                if (editText1.getText().toString().length() == 1)     //size as per your requirement
                {
                    editText2.requestFocus();
                }
            }

            public void beforeTextChanged(CharSequence s, int start,
                                          int count, int after) {
            }

            public void afterTextChanged(Editable s) {
            }

        });

    editText2.addTextChangedListener(new TextWatcher() {

            public void onTextChanged(CharSequence s, int start, int before, int count) {
                if (editText2.getText().toString().length() == 1)     //size as per your requirement
                {
                    editText3.requestFocus();
                }
            }

            public void beforeTextChanged(CharSequence s, int start,
                                          int count, int after) {
            }

            public void afterTextChanged(Editable s) {
            }

        });

and so on...

Concatenate the text from all the EditText.



回答4:

i made a generic TextWatcher for 6 digit OTP:

public class GenericTextWatcher implements TextWatcher {
        private View view;

        GenericTextWatcher(View view) {
            this.view = view;
        }

        @Override
        public void afterTextChanged(Editable s) {
            boolean allOtherFilled = false;
            EditText nextEdit = null;
            EditText previousEdit = null;
            switch (view.getId()) {
                case R.id.otp_et1:
                    allOtherFilled = otpEdit2.getText().length() == 1
                            && otpEdit3.getText().length() == 1
                            && otpEdit4.getText().length() == 1
                            && otpEdit5.getText().length() == 1
                            && otpEdit6.getText().length() == 1;
                    nextEdit = otpEdit2;
                    break;
                case R.id.otp_et2:
                    allOtherFilled = otpEdit1.getText().length() == 1
                            && otpEdit3.getText().length() == 1
                            && otpEdit4.getText().length() == 1
                            && otpEdit5.getText().length() == 1
                            && otpEdit6.getText().length() == 1;
                    nextEdit = otpEdit3;
                    previousEdit = otpEdit1;
                    break;
                case R.id.otp_et3:
                    allOtherFilled = otpEdit1.getText().length() == 1
                            && otpEdit2.getText().length() == 1
                            && otpEdit4.getText().length() == 1
                            && otpEdit5.getText().length() == 1
                            && otpEdit6.getText().length() == 1;
                    nextEdit = otpEdit4;
                    previousEdit = otpEdit2;
                    break;
                case R.id.otp_et4:
                    allOtherFilled = otpEdit1.getText().length() == 1
                            && otpEdit2.getText().length() == 1
                            && otpEdit3.getText().length() == 1
                            && otpEdit5.getText().length() == 1
                            && otpEdit6.getText().length() == 1;
                    nextEdit = otpEdit5;
                    previousEdit = otpEdit3;
                    break;
                case R.id.otp_et5:
                    allOtherFilled = otpEdit1.getText().length() == 1
                            && otpEdit2.getText().length() == 1
                            && otpEdit3.getText().length() == 1
                            && otpEdit4.getText().length() == 1
                            && otpEdit6.getText().length() == 1;
                    nextEdit = otpEdit6;
                    previousEdit = otpEdit4;
                    break;
                case R.id.otp_et6:
                    allOtherFilled = otpEdit1.getText().length() == 1
                            && otpEdit2.getText().length() == 1
                            && otpEdit3.getText().length() == 1
                            && otpEdit4.getText().length() == 1
                            && otpEdit5.getText().length() == 1;
                    previousEdit = otpEdit5;
                    break;
            }

            if (s.length() == 1) {
                if (allOtherFilled) {
                    //if next 2 edit texts are filled , enable the pay button
                    enableDisableButton(continueButton, true);
                    KeyboardUtils.hideKeyboard(LoginActivity.this, (EditText) view);
                }
            } else if (s.length() > 1) {
                if (allOtherFilled) {
                    //if all next edit texts are filled , enable the pay button
                    enableDisableButton(continueButton, true);
                    KeyboardUtils.hideKeyboard(LoginActivity.this, (EditText) view);

                } else if (nextEdit != null) {
                    if (nextEdit.getText().length() == 0) {
                        //if next edit is not filled, move to next edit and set the second digit
                        moveToNextEdit(nextEdit, (EditText) view);
                    } else {
                        //if any other edit is not filled, stay in current edit
                        enableDisableButton(continueButton, false);
                        stayOnCurrentEdit((EditText) view);
                    }
                }
            } else if (s.length() < 1) {
                if (null != previousEdit)
                    moveToPreviousEdit(previousEdit);
                enableDisableButton(continueButton, false);
            }
        }

        @Override
        public void beforeTextChanged(CharSequence arg0, int arg1, int arg2, int arg3) {
        }

        @Override
        public void onTextChanged(CharSequence arg0, int arg1, int arg2, int arg3) {
        }

        private void stayOnCurrentEdit(EditText editText) {
            editText.setText(editText.getText().toString().substring(0, 1));
            editText.setSelection(editText.getText().length());
        }

        private void moveToPreviousEdit(EditText editText) {
            editText.setSelection(editText.getText().length());
            editText.requestFocus();
        }

        private void moveToNextEdit(EditText editText2, EditText editText1) {
            editText2.setText(editText1.getText().toString().substring(1, 2));
            editText2.requestFocus();
            editText2.setSelection(editText2.getText().length());
            editText1.setText(editText1.getText().toString().substring(0, 1));
        }
    }

You can add this textWatcher to all your edit texts like this :

this.otpEdit1.addTextChangedListener(new GenericTextWatcher(otpEdit1));


回答5:

The below solution takes into consideration:

  1. Auto focusing to the next edit text on entering one digit of OTP in the focussed edit text.

  2. Auto focusing to the previous edit text on deleting one digit of OTP in the focussed edit text.

The combination of work in onTextChanged() and afterTextChanged() helps in achieving the same.

private EditText firstDigitOtpEdt, secondDigitOtpEdt, thirdDigitOtpEdt, fourthDigitOtpEdt;

firstDigitOtpEdt.addTextChangedListener(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) {
            if (firstDigitOtpEdt.getText().toString().length() == 1) {
                secondDigitOtpEdt.requestFocus();
            }
        }
    });

secondDigitOtpEdt.addTextChangedListener(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) {
            if (secondDigitOtpEdt.getText().toString().length() == 0) {
                firstDigitOtpEdt.requestFocus();
            }
        }

        @Override
        public void afterTextChanged(Editable editable) {
            if (secondDigitOtpEdt.getText().toString().length() == 1) {
                thirdDigitOtpEdt.requestFocus();
            }
        }
    });

thirdDigitOtpEdt.addTextChangedListener(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) {
            if (thirdDigitOtpEdt.getText().toString().length() == 0) {
                secondDigitOtpEdt.requestFocus();
            }
        }

        @Override
        public void afterTextChanged(Editable editable) {
            if (thirdDigitOtpEdt.getText().toString().length() == 1) {
                fourthDigitOtpEdt.requestFocus();
            }
        }
    });

fourthDigitOtpEdt.addTextChangedListener(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) {
            if (fourthDigitOtpEdt.getText().toString().length() == 0) {
                thirdDigitOtpEdt.requestFocus();
            }
        }

        @Override
        public void afterTextChanged(Editable editable) {
           // We can call api to verify the OTP here or on an explicit button click
        }
    });


回答6:

You can try this if you want to add some extra logic for delete the OTP, i create it based on the answer from A.R. make sure you set maxlength = 2 for all edittext

public class GenericTextWatcher implements TextWatcher
{
    private View view;
    private GenericTextWatcher(View view)
    {
        this.view = view;
    }
    @Override
    public void afterTextChanged(Editable editable) {
        // TODO Auto-generated method stub
        String text = editable.toString();
        switch (view.getId()) {

            case R.id.etOTP1:
                if (text.length() > 1) {
                    etOTP1.setText(String.valueOf(text.charAt(0)));
                    etOTP2.setText(String.valueOf(text.charAt(1)));
                    etOTP2.requestFocus();
                    etOTP2.setSelection(etOTP2.getText().length());
                }
                break;
            case R.id.etOTP2:
                if (text.length() > 1){
                    etOTP2.setText(String.valueOf(text.charAt(0)));
                    etOTP3.setText(String.valueOf(text.charAt(1)));
                    etOTP3.requestFocus();
                    etOTP3.setSelection(etOTP3.getText().length());
                }
                if (text.length() == 0){
                    etOTP1.requestFocus();
                    etOTP1.setSelection(etOTP1.getText().length());
                }
                break;
            case R.id.etOTP3:
                if (text.length() > 1){
                    etOTP3.setText(String.valueOf(text.charAt(0)));
                    etOTP4.setText(String.valueOf(text.charAt(1)));
                    etOTP4.requestFocus();
                    etOTP4.setSelection(etOTP4.getText().length());
                }
                if (text.length() == 0){
                    etOTP2.requestFocus();
                    etOTP2.setSelection(etOTP2.getText().length());
                }
                break;
            case R.id.etOTP4:
                if (text.length() == 0){
                    etOTP3.requestFocus();
                    etOTP3.setSelection(etOTP3.getText().length());
                }
                break;
        }
    }
    @Override
    public void beforeTextChanged(CharSequence arg0, int arg1, int arg2, int arg3) {
    }

    @Override
    public void onTextChanged(CharSequence arg0, int arg1, int arg2, int arg3) {
    }
}


回答7:

You can make a custom Editext and add it in your xml file, find below a custom class

public class CustomEntryEdittext extends LinearLayout { 

    public int entryCount = 0; //count of boxes to be created
    private int currentIndex = 0;
    private static int EDITTEXT_MAX_LENGTH = 1; //character size of each editext
    private static int EDITTEXT_WIDTH = 40;
    private static int EDITTEXT_TEXTSIZE = 20; //textsize
    private boolean disableTextWatcher = false, backKeySet = false;
    private TextWatcher txtWatcher;
    private onFinishListerner mListerner;


    public CustomEntryEdittext(Context context) {
        super(context, null);
    }

    public CustomEntryEdittext(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public CustomEntryEdittext(Context context, AttributeSet attrs, int defStyle) {
        this(context, attrs, defStyle, 0);
    }

    public CustomEntryEdittext(Context context, AttributeSet attrs, int defStyle, int defStyleRes) {
        super(context, attrs);
        init(context, attrs);
    }

    public void setOnFinishListerner(onFinishListerner listerner) {
        this.mListerner = listerner;
    }

    public interface onFinishListerner {
        void onFinish(String enteredText);
    }


    private void init(Context context, AttributeSet attrs) {

        TypedArray a = context.obtainStyledAttributes(attrs,
                R.styleable.CustomEntryEdittext, 0, 0);


        entryCount = a.getInteger(R.styleable.CustomEntryEdittext_editextCount, 0);

        a.recycle();

        setOrientation(LinearLayout.HORIZONTAL);
        setGravity(Gravity.CENTER_VERTICAL);

        for (int i = 0; i < entryCount; i++) {

            //creates edittext based on the no. of count
            addView(initialiseAndAddChildInLayout(i, context), i);
        }

    }

    //method focuses of previous editext
    private void getPreviousEditext(int index) {
        if (index > 0) {
            EditText edtxt = (EditText) getChildAt(index - 1);
            disableTextWatcher = true;

             edtxt.setText("");
            edtxt.requestFocus();
            disableTextWatcher = false;

        }
    }

    //method focuses of previous editext
    private void getPreviousEditextFocus(int index) {
        if (index > 0) {
            EditText edtxt = (EditText) getChildAt(index - 1);
            disableTextWatcher = true;
            edtxt.requestFocus();
            disableTextWatcher = false;
        }
    }


    //method to focus on next edittext
    private void getNextEditext(int index) {
        if (index < entryCount - 1) {
            EditText edtxt = (EditText) getChildAt(index + 1);
            edtxt.requestFocus();
        }
    }


    private View initialiseAndAddChildInLayout(int index, Context context) {
        final EditText editext = new EditText(context);
        editext.setMaxWidth(1);
        editext.setTag(index);
        editext.setGravity(Gravity.CENTER);
        editext.setTextSize(EDITTEXT_TEXTSIZE);
        editext.setInputType(EditorInfo.TYPE_CLASS_NUMBER);
        editext.setFilters(new InputFilter[]{new InputFilter.LengthFilter(EDITTEXT_MAX_LENGTH)});
        LayoutParams param = new LayoutParams(0, LayoutParams.WRAP_CONTENT, 1);
        editext.setLayoutParams(param);
        editext.addTextChangedListener(txtWatcher = new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count, int after) {


            }

            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {
                currentIndex = Integer.parseInt(editext.getTag().toString());


                if (editext.getText().toString().length() == 1 && !disableTextWatcher) {
                    getNextEditext(currentIndex);
                } else if (editext.getText().toString().length() == 0 && !disableTextWatcher) {// && !isFirstTimeGetFocused && !backKeySet) {
                    getPreviousEditext(currentIndex);
                }

            }

            @Override
            public void afterTextChanged(Editable s) {


            }
        });
        editext.setOnKeyListener(new OnKeyListener() {
            @Override
            public boolean onKey(View v, int keyCode, KeyEvent event) {
                if (keyCode == KeyEvent.KEYCODE_DEL) {
                    currentIndex = Integer.parseInt(editext.getTag().toString());
                    if (editext.getText().toString().length() == 0 && !disableTextWatcher) {
                        getPreviousEditextFocus(currentIndex);
                    } else {
                        disableTextWatcher = true;
                        editext.setText("");
                        disableTextWatcher = false;
                    }
                    backKeySet = true;
                }

                return true;
            }


        });
        editext.setOnEditorActionListener(new TextView.OnEditorActionListener() {
            public boolean onEditorAction(TextView v, int actionId, KeyEvent event) {
                if ((event != null && (event.getKeyCode() == KeyEvent.KEYCODE_ENTER)) || (actionId == EditorInfo.IME_ACTION_DONE)) {
                    if(currentIndex==entryCount-1 && getEnteredText().length()==entryCount)
                    {
                        mListerner.onFinish(getEnteredText());
                    }
                }
                return false;
            }
        });

        return editext;
    }


    public String getEnteredText() {
        String strEnteredValue = "";
        for (int i = 0; i < getChildCount(); i++) {
            EditText editText = (EditText) getChildAt(i);
            if (editText.getText() != null && editText.getText().toString().length() > 0)
                strEnteredValue = strEnteredValue + editText.getText().toString();

        }
        return strEnteredValue;
    }

    public void clearCustomEntryEdittext() {
        for (int i = 0; i < getChildCount(); i++) {
            EditText editText = (EditText) getChildAt(i);
            editText.setText("");
        }
        EditText editText = (EditText) getChildAt(0);
        editText.requestFocus();
    }
}

//and add it in your xml file

<com.custom.widget.CustomEntryEdittext
android:id=”@+id/custom_unique_edittext”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_alignParentLeft=”true”
android:layout_centerInParent=”true”
app:editextCount=”6″>
</com.custom.widget.CustomEntryEdittext>

For reference check below link

https://madoverandroid.wordpress.com/2017/07/11/edittext-with-separate-box-for-each-letter-customentryedittext/



回答8:

You can subclass a TextWatcher and implement your own logic.

public class OTPTextWatcher implements TextWatcher {

private EditText view;
private List<EditText> otpDigitViews;
private OTPListener otpListener;

public OTPTextWatcher(EditText otpView, List<EditText> otpDigitViews, OTPListener listener) {
    view = otpView;
    this.otpDigitViews = otpDigitViews;
    this.otpListener = listener;
}


@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) {

    String digit1 = otpDigitViews.get(0).getText().toString();
    String digit2 = otpDigitViews.get(1).getText().toString();
    String digit3 = otpDigitViews.get(2).getText().toString();
    String digit4 = otpDigitViews.get(3).getText().toString();
    String currentDigit = editable.toString();
    final String inputValue = digit1 + digit2 + digit3 + digit4;

    if (inputValue.length() == 4) {
        if (inputValue.equals("1234")) {
            otpListener.onOTPSuccess();
        } else {
            otpListener.onOTPError();
        }
    } else {
        if (currentDigit.length() >= 1
                && view != otpDigitViews.get(3)) {
            if (view != null)
                view.focusSearch(View.FOCUS_RIGHT).requestFocus();
        } else {
            if (currentDigit.length() <= 0 && view.getSelectionStart() <= 0) {
                try {
                    view.focusSearch(View.FOCUS_LEFT).requestFocus();
                } catch (NullPointerException e) {
                    LogHelper.printErrorLog("There is not view left to current edit text");
                }
            }
        }
    }
}

public interface OTPListener {
    void onOTPSuccess();

    void onOTPError();
}}


回答9:

using DataBinding layout:

public class EnterOTPActivity extends AppCompatActivity {
            private ActivityEnterOtpBinding binding;
            private Context mContext;
            private int currentEditIndex;


            @Override
            protected void onCreate(@Nullable Bundle savedInstanceState) {
                super.onCreate(savedInstanceState);
                binding = DataBindingUtil.setContentView(this, R.layout.activity_enter_otp);
                mContext = this;

                binding.et1.addTextChangedListener(new MyTextChangeWatcher(1));
                binding.et2.addTextChangedListener(new MyTextChangeWatcher(2));
                binding.et3.addTextChangedListener(new MyTextChangeWatcher(3));
                binding.et4.addTextChangedListener(new MyTextChangeWatcher(4));
                binding.et5.addTextChangedListener(new MyTextChangeWatcher(5));
                binding.et6.addTextChangedListener(new MyTextChangeWatcher(6));

                binding.et1.setOnKeyListener(keyListener);
                binding.et2.setOnKeyListener(keyListener);
                binding.et3.setOnKeyListener(keyListener);
                binding.et4.setOnKeyListener(keyListener);
                binding.et5.setOnKeyListener(keyListener);
                binding.et6.setOnKeyListener(keyListener);


            }

            private View.OnKeyListener keyListener = new View.OnKeyListener() {

                @Override
                public boolean onKey(View v, int keyCode, KeyEvent event) {

                    if ((((EditText) v).getText().toString() == null || ((EditText) v)
                            .getText().toString().isEmpty())
                            && keyCode == KeyEvent.KEYCODE_DEL
                            && event.getAction() == KeyEvent.ACTION_DOWN) {

                        if (currentEditIndex == 6)
                            currentEditIndex = 5;
                        if (currentEditIndex > 0) {
                            EditText editText = getEditTextFromIndex(currentEditIndex);
                           editText.setText("");
                            editText.requestFocusFromTouch();
                            currentEditIndex--;
                        }
                    }

                    return false;
                }
            };

            class MyTextChangeWatcher implements TextWatcher {
                private int index;

                public MyTextChangeWatcher(int index) {
                    super();
                    this.index = index;
                }

                @Override
                public void afterTextChanged(Editable s) {
                    if (s != null && s.length() == 1) {
                        if (index < 7) {

                            if (index < 6) {
                                EditText editText = getEditTextFromIndex(index);
                                editText.clearFocus();
                                getEditTextFromIndex(index + 1).requestFocusFromTouch();
                            }
                            currentEditIndex = index;
                        } else {

                        }
                    } else {
                    }
                }

                @Override
                public void beforeTextChanged(CharSequence s, int start, int count,
                                              int after) {
                }

                @Override
                public void onTextChanged(CharSequence s, int start, int before,
                                          int count) {
                }
            }

            private EditText getEditTextFromIndex(int index) {
                switch (index) {
                    case 1:
                        return binding.et1;
                    case 2:
                        return binding.et2;
                    case 3:
                        return binding.et3;
                    case 4:
                        return binding.et4;
                    case 5:
                        return binding.et5;
                    case 6:
                        return binding.et6;

                    default:
                        break;
                }
                return null;
            }
        }


回答10:

These are some of the links that might help. You can customize it as per your requirement.

This link is a step by step tutorial on how you can create pin entry UI for yourself. https://medium.com/@ali.muzaffar/building-a-pinentryedittext-in-android-5f2eddcae5d3#.ldp03yky7

PinEntry android Library https://github.com/Philio/PinEntryView