Issue in Changing EditText background after setting error to the TextInputLayout on Android M

Question

I have set custom background to the EditText in Xml file. After validation, i am setting different background to EditText at runtime and also setting error to TextInputLayout. But in Android M instead of setting background resource, it is setting background color to EditText.

This is image before setting error to the TextInputLayout

This is the image after setting error to the TextInputLayout

Below is my code:-

XML file code

<android.support.design.widget.TextInputLayout
android:id="@+id/input_layout_name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
app:errorTextAppearance="@style/ErrorText">

<EditText
    android:id="@+id/input_name"
    android:layout_width="fill_parent"
    android:layout_height="40dp"
    android:background="@drawable/edittext_selector"
    android:hint="@string/hint_name"
    android:imeOptions="actionNext"
    android:inputType="textEmailAddress" />

</android.support.design.widget.TextInputLayout>

Validation code

if (inputName.getText().toString().trim().isEmpty()) {
    inputLayoutName.setErrorEnabled(true);
    inputLayoutName.setError("Errorrroror");
    inputName.setBackgroundResource(R.drawable.edittext_red_focused);
    requestFocus(inputName);
    return false;
} else {
    inputName.setBackgroundResource(R.drawable.edittext_selector);
    inputLayoutName.setErrorEnabled(false);
}

return true;

Below is my resource file for error

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<solid android:color="@color/sale_color" />
</shape>
</item>

<!-- main color -->
<item
android:bottom="1.0dp"
android:left="1.0dp"
android:right="1.0dp">
<shape>
<solid android:color="@android:color/white" />
</shape>
</item>

<!-- draw another block to cut-off the left and right bars -->
<item android:bottom="1.0dp">
<shape>
<solid android:color="@android:color/white" />
</shape>
</item>
</layer-list>

Answer 1

You can achieve this using custom Edittext background.

Create selector drawable like below,

Then,

edittext_normal.xml

<item>
    <shape android:shape="rectangle">
        <solid android:color="@android:color/transparent" />
    </shape>
</item>

<item
    android:left="-2dp"
    android:right="-2dp"
    android:top="-2dp">
    <shape>
        <solid android:color="@android:color/transparent" />
        <stroke
            android:width="1dp"
            android:color="@color/edit_text_normal_color" />
    </shape>
</item>

edittext_focused.xml

<item>
    <shape android:shape="rectangle">
        <solid android:color="@android:color/transparent" />
    </shape>
</item>

<item
    android:left="-2dp"
    android:right="-2dp"
    android:top="-2dp">
    <shape>
        <solid android:color="@android:color/transparent" />
        <stroke
            android:width="1dp"
            android:color="@color/colorPrimary" />
    </shape>
</item>

edittext_red_focused.xml

<item>
    <shape android:shape="rectangle">
        <solid android:color="@android:color/transparent" />
    </shape>
</item>

<item
    android:left="-2dp"
    android:right="-2dp"
    android:top="-2dp">
    <shape>
        <solid android:color="@android:color/transparent" />
        <stroke
            android:width="1dp"
            android:color="@color/sale_color" />
    </shape>
</item>

And set the error drawable at runtime, when error occurs

Validation Code

private boolean validateName() {

    if (inputName.getText().toString().trim().isEmpty()) {
        inputLayoutName.setErrorEnabled(true);
        inputLayoutName.setError("Error");
        inputName.setBackgroundResource(R.drawable.edittext_red_focused);
        return false;
    } else {
        inputName.setBackgroundResource(R.drawable.edittext_selector);
        inputLayoutName.setErrorEnabled(false);
    }

    return true;
}