Keep TextInputLayout always focused or keep label always expanded

Question

I was wondering if it's possible to always keep the label expanded regardless of whether or not there is text in the EditText. I looked around in the source and it is a using a ValueAnimator and a counter inside a TextWatcher to animate or not animate changes. Maybe I can set a custom TextWatcher with a custom ValueAnimator on the EditText inside the TextInputLayout?

Answer 1

The current version of the TextInputLayout exists specifically to do one thing - show / hide the helper label depending on whether there's some text in the EditText or not. What you want is different behaviour, so you need a different widget than the TextInputLayout. This case is the perfect candidate to writing a custom view that will suit your needs.

That said, your idea of setting a custom TextWatcher to the EditText won't work either because TextInputLayout doesn't expose anything of it's internals that actually handle the animations - neither updateLabelVisibility(), setEditText(), the magic Handler that does the work or anything else. Of course we surely don't want to go the reflection path for a detail like this, so...

Just use MaterialEditText! It has the following property that does exactly what you want.

met_floatingLabelAlwaysShown: Always show the floating label, instead of animating it in/out. False as default.

The library is quite stable (I'm using it in two different projects myself) and has plenty of options to customise. Hope it helps!

Answer 2

For me with support design 23.3.0 it works to use

              <android.support.design.widget.TextInputLayout
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:hint="wow such hint"
              app:hintEnabled="true"
              app:hintAnimationEnabled="false"
              />

Answer 3

Despite the top answer, I still simply came up with a Java Reflection solution to achieve the desired behavior (using com.google.android.material.textfield.TextInputLayout from com.google.android.material:material:1.0.0):

/**
 * Creation Date: 3/20/19
 *
 * @author www.flx-apps.com
 */
public class CollapsedHintTextInputLayout extends TextInputLayout {
    Method collapseHintMethod;

    public CollapsedHintTextInputLayout(Context context) {
        super(context);
        init();
    }

    public CollapsedHintTextInputLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public CollapsedHintTextInputLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    void init() {
        setHintAnimationEnabled(false);

        try {
            collapseHintMethod = TextInputLayout.class.getDeclaredMethod("collapseHint", boolean.class);
            collapseHintMethod.setAccessible(true);
        }
        catch (Exception ignored) {
            ignored.printStackTrace();
        }
    }

    @Override
    public void invalidate() {
        super.invalidate();
        try {
            collapseHintMethod.invoke(this, false);
        }
        catch (Exception e) {
            e.printStackTrace();
        }
    }
}

Java Reflection is of course never pretty, but in my case, it just was the more handy solution than creating a similar looking widget, and the linked library seemed outdated and abandoned… :/

Don't forget to add the respective ProGuard rules if you use it:

-keepclassmembers class com.google.android.material.textfield.TextInputLayout {
    private void collapseHint;
}

Answer 4

The new attribute app:expandedHintEnabled (since 1.3.0) solves this problem without subclassing and other hacks.

https://github.com/material-components/material-components-android/issues/810

Answer 5

Here's a trick you can use that will allow you to put the label hint in the layout and the textbox hint in the edittext without them clashing. It will work better than the above reflection solution as well, as it prevents the original bad drawing from happening and doesn't require you to address minification/proguar settings, since it does class-to-class comparison.

Subclass TextInputEditText as follows:

import android.content.Context
import android.text.Editable
import android.text.SpannableStringBuilder
import android.util.AttributeSet
import com.google.android.material.R
import com.google.android.material.textfield.TextInputEditText
import com.google.android.material.textfield.TextInputLayout

class MonkeyedTextInputEditText @JvmOverloads constructor(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = R.attr.editTextStyle) : TextInputEditText(context, attrs, defStyleAttr) {
    @Override
    override fun getText(): Editable? {
        val text = super.getText()
        if (!text.isNullOrEmpty())
            return text
        /* We want this expression in TextInputLayout.java to be true if there's a hint set:
         *        final boolean hasText = editText != null && !TextUtils.isEmpty(editText.getText());
         * But for everyone else it should return the real value, so we check the caller.
         */
        if (!hint.isNullOrEmpty() && Thread.currentThread().stackTrace[3].className == TextInputLayout::class.qualifiedName)
            return SpannableStringBuilder(hint)
        return text
    }
}

Then your layouts can look like:

<com.google.android.material.textfield.TextInputLayout
    ...
    android:hint="YOUR LABEL TEXT"
    ...
    >

    <yourapp.MonkeyedTextInputEditText
        ...
        android:hint="YOUR PLACEHOLDER TEXT"
        ...
        />
</com.google.android.material.textfield.TextInputLayout>