Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

TextInputLayout animation overlaps the text when the text is set programmatically

I am using TextInputLayout with the design support library 22.2.1.

I set the value of the EditText programmatically, and when the screen appears, I can see that the hint of the TextInputLayout overlaps the text inside, before moving in the floating position.

Here a simple layout:

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <EditText
            android:id="@+id/editText1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="hint1" />

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

In my Activity:

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

        EditText e1 = (EditText) findViewById(R.id.editText1);
        e1.setText("TEXT TEST 1");
   }

Does anyone know a workaround?

enter image description here

like image 642
Gabriele Mariotti Avatar asked Jul 21 '15 16:07

Gabriele Mariotti


People also ask

How do I remove TextInputLayout error?

Now you can simply do input. setError(..) for new error and input. setErrorEnabled(false) to remove it.

How do I get TextInputLayout from text?

Just use: TextInputLayout textInputLayout = findViewById(R. id. custom_end_icon); String text = textInputLayout.

What is the use of TextInputLayout in Android?

The primary use of a TextInputLayout is to act as a wrapper for EditText(or its descendant) and enable floating hint animations. Rule of Thumb : TextInputLayout should wrap TextInputEditText instead of the normal EditText.


3 Answers

Currently the only way to avoid this behavior is to add the EditText programmatically.

  1. Create a TextInputLayout without the EditText. Programmatically or via XML inflation - doesn't matter, but it has to be empty.
  2. Create the EditText and set its text to whatever you need.
  3. Add the EditTExt to the TextInputLayout.

Here's an example:

TextInputLayout til = (TextInputLayout) findViewById(R.id.til);
til.setHint(R.string.hint);

EditText et = new EditText(getContext());
et.setText(value);

til.addView(et);

UPDATED 21/08/2015 WITH DESIGN LIBRARY V23:

With the design support library v23 you can disable the animation:

Just use the setHintAnimationEnabled method:

textInputLayout.setHintAnimationEnabled(boolean)

Here the issue on Google Tracker.

like image 183
Gabriele Mariotti Avatar answered Oct 22 '22 08:10

Gabriele Mariotti


I ran into this issue recently while using DialogFragment. To solve, simply disable the hint animation if you have a value in the field before you set the field value. The order is important.

For example,

TextInputLayout layout = (TextInputLayout) findViewById(R.id.text_layout);
TextInputEditText edit = (TextInputEditText) findViewById(R.id.text_edit);

String fieldValue = "Something";

layout.setHintAnimationEnabled(fieldValue == null);
edit.setText(fieldValue);

This way the layout does not initiate the animation when the text is set. You can also watch for text changes and enable it again when the field is empty.

like image 33
smallstepstoday Avatar answered Oct 22 '22 09:10

smallstepstoday


You can directly specify in the XML for TextInputLayout :

 app:hintAnimationEnabled="false"
like image 43
Saurabh Padwekar Avatar answered Oct 22 '22 07:10

Saurabh Padwekar