How to set counter color on TextInputLayout?

Question

I am using TextInputLayout wrapped around an EditText. The counter is black right now, I want it to be white. I'm not sure which option to set to be white.

<android.support.design.widget.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content" app:counterEnabled="true" android:textColor="@color/white" android:textColorHint="@color/white" > <EditText android:id="@+id/myfield" android:layout_width="match_parent" android:layout_height="wrap_content" android:backgroundTint="@color/white" android:hint="@string/myfield_hint" android:inputType="text" android:maxLength="26" android:textColor="@color/white" android:textColorHint="@color/white"/> </android.support.design.widget.TextInputLayout> 

Answer 1

Please add:

 app:counterTextAppearance="@android:color/white" 

for your TextInputLayout.

Hope this helps!

Answer 2

I decided to write this answer based on the comments of the previous one.

First you need to create a style for your counter, for example:

 <style name="CounterStyle" parent="TextAppearance.AppCompat.Small"> <item name="android:textColor">@android:color/white</item> <!--other parameters that you want to change --> </style> 

Then add this style to TextInputLayout:

 app:counterTextAppearance="@style/CounterStyle" 

To make it all work. Full code:

 <android.support.design.widget.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content" app:counterEnabled="true" app:counterTextAppearance="@style/CounterStyle" android:textColor="@color/white" android:textColorHint="@color/white"> <EditText android:id="@+id/myfield" android:layout_width="match_parent" android:layout_height="wrap_content" android:backgroundTint="@color/white" android:hint="@string/myfield_hint" android:inputType="text" android:maxLength="26" android:textColor="@color/white" android:textColorHint="@color/white"/> </android.support.design.widget.TextInputLayout> 

You can also use some style for overflow counter:

 app:counterOverflowTextAppearance="@style/YourOverflowTextStyleHere" 

As described here (thanks @Sufian for the link)