Weird behavior when using inside TextInputLayout

[ramonsgds]

When using it by itself, everything is perfect. When using the edit text inside a TextInputLayout, some weird behavior happens inside the "(..)". I've tested multiple arrangements for the mask and the numbers always get unordered when the edit text is inside a TextInputLayout.

It's impressive though, that after I delete all the text that was formatted wrong, and start over again, I get it perfect. It seems that a boolean might be interfering with that so that I always get the weird behavior when starting the activity. However, if I type and afterwards hit backspace until edit text is clear, and start typing again (the same visual configuration I would have in the beginning of activity) I now get it right. This might help discovering the bug (some boolean is set after I typed first two letters which is not being set at the beginning of activity lifecycle?)

I believe the best approach would be to try yourself and pretty much you'll get what I am describing. Here's my xml:

<android.support.design.widget.TextInputLayout
    android:id="@+id/editPhoneInputLayout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginBottom="20dp"
    android:layout_marginEnd="16dp"
    android:layout_marginStart="16dp"
    android:layout_marginTop="20dp"
    android:theme="@style/TextInputLayoutTheme"
    app:hintTextAppearance="@style/TextHintTheme"
    app:layout_constraintBottom_toTopOf="@+id/editPhoneButton"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.39999998">

    <com.vicmikhailau.maskededittext.MaskedEditText
        android:id="@+id/editPhoneEdt"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fontFamily="@font/gidole"
        android:hint="Número de telefone"
        android:imeOptions="actionDone"
        app:mask="(##) #####-####"
        android:inputType="number"
        android:maxLength="15"
        android:maxLines="1"
        android:paddingBottom="15dp"
        android:textSize="18sp" />
</android.support.design.widget.TextInputLayout>

[VicMikhailau]

Hello ramonsgds,

Thanks for finding the bug and giving steps to reproduce it.

[stakenschneider]

I ran into the same problem. Hopefully you will fix it soon. Thanks!

[VicMikhailau]

Hello, ramonsgds .
Hello, stakenschneider.

Sorry for the late reply.

Unfortunately, there is no way to devote much time to the project. Please feel free to Fork the project and add Pull requests.

Thanks a lot!

[madrazzl3]

Reason of bug: mutability of TextWatchers list
Simplest work-around: set mask from code AFTER setup of TextWatchers.

For TextInputLayout it means you should set mask only from code.

[SemKaminskyi]

as for me work-around are SET mask after focused view

phoneInputEditText.onFocusChangeListener =
        OnFocusChangeListener { v, hasFocus ->
            if (hasFocus){
                setMask(holder.phoneInputEditText,formatterET,hintET)
            }
        }


private fun setMask(v: EditText, formatter: MaskedFormatter, hint: String) {
    v.removeTextChangedListener(textWatcher)
    v.setText("")
    v.hint = hint
    textWatcher = MaskedWatcher(formatter, v)
    v.addTextChangedListener(textWatcher)
}

[footgear404]

The bug is still alive. To get around it, I removed the mask from the markup and set it from the code:
In my xml inside TextInputLayout
<com.vicmikhailau.maskededittext.MaskedEditText android:id="@+id/phone_input" style="@style/Theme.OnlineStore.TextInputEditText" android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="Phone number" android:inputType="number" />
In my fragment: phoneInput.setMask("+1 (###) ### ## ##")`
That is work correctly for me.