Input Layout toggle hintText color change

Question

I am using TextInputLayout in which i want to change the color of hinttext when i enter text then the color of hint text should be blue other wise color should be gray and when edittext contains some value then the color of hintText should blue for more information please check my image.

Ultimate i want this after edit text containing some value.

This is my current result after using this code

  <style name="labelcolor" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Hint color and label color in FALSE state -->
    <item name="android:textColorHint">#868686</item>
    <item name="android:textSize">16sp</item>
    <item name="android:paddingTop">5sp</item>
    <!-- Label color in TRUE state and bar color FALSE and TRUE State -->
    <item name="colorAccent">#0ea3ff</item>
    <item name="colorControlNormal">#0ea3ffr</item>
    <item name="colorControlActivated">#0ea3ff</item>
</style>

please help me how can i solve this issues.

Once you start typing hint text will not visible, so you cant change the color of hint text. you can change the color of text that you have entered. — Rahul Devanavar, Nov 13 '17 at 10:04
check this answer https://stackoverflow.com/a/30914037/1993001 — Rahul Devanavar, Nov 13 '17 at 10:11

score 2 · Accepted Answer · answered Nov 14 '17 at 12:36

Change TextInputLayout Lebel Color Dynamicaly in on Focus change of edittext and pass color according work for me.

 public static void textInoutLayoutColor(TextInputLayout textInputLayout, @ColorInt int color) {

    try {
        Field fDefaultTextColor = TextInputLayout.class.getDeclaredField("mDefaultTextColor");
        fDefaultTextColor.setAccessible(true);
        fDefaultTextColor.set(textInputLayout, new ColorStateList(new int[][]{{0}}, new int[]{ color }));

        Field fFocusedTextColor = TextInputLayout.class.getDeclaredField("mFocusedTextColor");
        fFocusedTextColor.setAccessible(true);
        fFocusedTextColor.set(textInputLayout, new ColorStateList(new int[][]{{0}}, new int[]{ color }));
    } catch (Exception e) {
        e.printStackTrace();
    }
}

and change the color like this.

input_layout= (TextInputLayout) findViewById(R.id.input_layout);
   etuser_name.setOnFocusChangeListener(new View.OnFocusChangeListener() {
        @Override
        public void onFocusChange(View view, boolean hasfocus) {
            if(hasfocus){
                textInoutLayoutColor(input_layout,getResources().getColor(R.color.bullet_color));
            }
            else
            {
                if(etuser_name.getText().toString().trim().length()>0) {
                    textInoutLayoutColor(input_layout,getResources().getColor(R.color.bullet_color));;
                }
                else
                {
                    textInoutLayoutColor(input_layout,getResources().getColor(R.color.hint_grey));
                }
            }
        }
    });

score 0 · Answer 2 · answered Nov 13 '17 at 10:25

Create your as bellow and try

<style name="EditTextHint" parent="TextAppearance.AppCompat">
    <item name="colorAccent">@android:color/white</item>
    <item name="android:textColorHint">@color/BackgroundtWhiteColor</item>
    <item name="colorControlNormal">@color/BackgroundtWhiteColor</item>
    <item name="colorControlActivated">@color/your color</item>
    <item name="colorControlHighlight">@color/BackgroundtWhiteColor</item>
</style>

Use it as bellow

<android.support.design.widget.TextInputLayout
            android:theme="@style/EditTextHint"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
      <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
</android.support.design.widget.TextInputLayout>

Sharanjeet Kaur · Answer 3 · 2017-11-13T13:01:27.313

Firstly you need to set your TextInputLayout

 android.support.design.widget.TextInputLayout textInputLayout =        (TextInputLayout) view.findViewById(R.id.textInputLayout);

textInputLayout.setHintTextAppearance(R.style.Instyle);

and then in styles.xml file you can create your styles with the color for the hint color.

<style name="Instyle" parent="AppThemeLight">
    <itemname="android:textColorPrimary">@android:color/darker_gray</item>
    <item name="android:textColor">@android:color/darker_gray</item>
</style>

score 0 · Answer 4 · answered Nov 13 '17 at 13:04

TextInputLayout takes colorAccent to hintTextColor when you start entering values in edittext. So if you want it to be blue then set your colorAccent to blue colour in your theme. And when edittext has no value then set hintTextColor to grey. Do like this

<android.support.design.widget.TextInputLayout
                    android:id="@+id/userNameTIL"
                    android:layout_width="match_parent"
                    android:layout_height="55dp"
                    android:background="@color/spinnerBg"
                    android:clipToPadding="false"
                    android:gravity="bottom"
                    android:paddingTop="4dp"
                    android:textColorHint="@color/grey"> /*Here it sets color to hintText when edittext has no value */

                    <EditText
                        android:layout_width="match_parent"
                        android:layout_height="50dp"
                        android:layout_gravity="bottom"
                        android:background="@null"
                        android:hint="Username"
                        android:inputType="text"
                        android:maxLength="30"
                        android:paddingEnd="3dp"
                        android:paddingStart="25dp"
                        android:paddingTop="3dp"
                        android:singleLine="true"
                        android:textColor="@color/black"
                        android:textColorHint="@color/black"
                        android:textSize="20sp"/>
                </android.support.design.widget.TextInputLayout>

score 0 · Answer 5 · answered Nov 13 '17 at 14:26

<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
                <!--EditText hint color-->
                <item name="android:textColorHint">@color/default_app_white</item>             <!-- TextInputLayout text color-->
                <item name="colorControlActivated">@color/default_app_green</item>
                <!-- EditText line color when EditText on-focus-->
                <item name="colorControlHighlight">@color/default_app_green</item>
                <!-- EditText line color when EditText  in un-focus-->
                <item name="colorControlNormal">@color/default_app_white</item>
            </style>
 <!-- In your style.xml file -->

try this one but it affects your whole application

Input Layout toggle hintText color change

5 Answers5