How to divide text in EditText?

Question

I need input text(digits) in EditText and i want to divide group of digits by 4 digits.

if i input 000000000000 i want see something like this 0000 0000 0000 .

My EditText:

        @NotEmpty
        @InjectView(R.id.paymentCode)
        EditText paymentCodeField;
...

    paymentCodeField.setOnTouchListener(eventHandler);
...

I think it need listener but i don't know how do it.

I tried below code

paymentCodeField.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) {

            }
        });

but i don't know how to use it.

make 4 edit text with max length 4 character and use addTextChangedListener to jump to next edit text field — Syed Raza Mehdi, May 25 '15 at 09:40
see this http://www.codeitive.com/0HHgPVqjPj/custom-format-edit-text-input-android-to-accept-credit-card-number.html — Syed Raza Mehdi, May 25 '15 at 09:42
the first one was my own implementation idea, second one i find it for you. Both will work... — Syed Raza Mehdi, May 25 '15 at 09:44
http://horribile.blogspot.co.nz/2011/12/using-mask-with-edittext.html — Dreamweaver, May 25 '15 at 09:44

score 2 · Answer 1 · answered May 25 '15 at 10:02

A way to get it is creating a mask, but android don't help us with that purpose.

You can implement your own mask, or you can use a library.

https://github.com/toshikurauchi/MaskedEditText/tree/master/MaskedEditText

<br.com.sapereaude.maskedEditText.MaskedEditText 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    mask:mask="#### #### ####"
/>

score 2 · Answer 2 · answered May 11 '17 at 19:58

1. Add a count global variable to count the number of input char.

2. Update count inside onTextChanged() and add checking inside afterTextChanged().

3. If count equal 4, then add space to current editable text and set it to EditText and also change the cursor position to last using setSelection() method.

4. Finally, rest count value for next inputs.

Here is the working code:

    int count = 0;

    ................
    ....................

    paymentCodeField.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) {

            count++;
        }

        @Override
        public void afterTextChanged(Editable editable) {

            if (count == 4) {
                String str = editable.toString();
                str = str + " ";

                editText.setText(str);

                // Required to move cursor position after space
                editText.setSelection(str.length());

                count = 0;
            }
        }
    });

OUTPUT:

Hope this will help~

score 0 · Answer 3 · answered May 25 '15 at 10:06

Try this one : This is for phone number

_edtphonenumber=(EditText)findViewById(R.id.editText_phonenumber);

    _edtphonenumber.setTypeface(trajan_pro_regular);
    _edtphonenumber.addTextChangedListener(new TextWatcher() {
        private boolean mFormatting; // this is a flag which prevents the  stack overflow.
        private int mAfter;

        @Override
        public void onTextChanged(CharSequence s, int start, int before, int count) {
            // nothing to do here.. 
        }

        //called before the text is changed...
        @Override
        public void beforeTextChanged(CharSequence s, int start, int count, int after) {
            //nothing to do here...
            mAfter  =   after; // flag to detect backspace..

        }

        @Override
        public void afterTextChanged(Editable s) {
            // Make sure to ignore calls to afterTextChanged caused by the work done below
            if (!mFormatting) {
                mFormatting = true;
                // using US formatting...
                if(mAfter!=0) // in case back space ain't clicked...
                    PhoneNumberUtils.formatNumber(s,PhoneNumberUtils.getFormatTypeForLocale(Locale.US));                             
                mFormatting = false;
            }
        }
    });

score 0 · Answer 4 · answered May 25 '15 at 10:16

You should write code into beforeTextChanged

paymentCodeField.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {
if (charSequence.length() % 4 == 0) paymentCodeField.setText(charSequence.toString() + " ");
            }

            @Override
            public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {

            }

            @Override
            public void afterTextChanged(Editable editable) {

            }
        });

You can customize your input into Edit Text, it will help you !!

score 0 · Answer 5 · edited May 11 '17 at 19:45

After text change replace all spaces and insert space in request position

paymentCodeField.addTextChangedListener(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) {
        }

        @Override
        public void afterTextChanged(Editable s) {
            s.toString().replace(" ","");

            if(s.toString().length()>4 && s.toString().charAt(4)!=' ')
                s.insert(4," ");

            if(s.toString().length()>9 && s.toString().charAt(9)!=' ')
                s.insert(9," ");
        }
    });

How to divide text in EditText?

5 Answers5