How to change the floating label color of TextInputLayout
Try The Below Code It Works In Normal State
<android.support.design.widget.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:theme="@style/TextLabel"> <android.support.v7.widget.AppCompatEditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="Hiiiii" android:id="@+id/edit_id"/> </android.support.design.widget.TextInputLayout>
In Styles Folder TextLabel Code
<style name="TextLabel" parent="TextAppearance.AppCompat"> <!-- Hint color and label color in FALSE state --> <item name="android:textColorHint">@color/Color Name</item> <item name="android:textSize">20sp</item> <!-- Label color in TRUE state and bar color FALSE and TRUE State --> <item name="colorAccent">@color/Color Name</item> <item name="colorControlNormal">@color/Color Name</item> <item name="colorControlActivated">@color/Color Name</item> </style>
Set To Main Theme of App,It Works Only Highlight State Only
<item name="colorAccent">@color/Color Name</item>
Update:
UnsupportedOperationException: Can't convert to color: type=0x2 in api 16 or below
Update:
Are you using Material Components Library
You can add below lines to your main theme
<item name="colorPrimary">@color/your_color</item> // Activated State <item name="colorOnSurface">@color/your_color</item> // Normal State
or else do you want different colors in noraml state and activated state and with customization follow below code
<style name="Widget.App.TextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox"> <item name="materialThemeOverlay">@style/ThemeOverlay.App.TextInputLayout</item> <item name="shapeAppearance">@style/ShapeAppearance.App.SmallComponent</item> //Changes the Shape Apperance <!--<item name="hintTextColor">?attr/colorOnSurface</item>--> //When you added this line it will applies only one color in normal and activate state i.e colorOnSurface color</style><style name="ThemeOverlay.App.TextInputLayout" parent=""> <item name="colorPrimary">@color/colorPrimaryDark</item> //Activated color <item name="colorOnSurface">@color/colorPrimary</item> //Normal color <item name="colorError">@color/colorPrimary</item> //Error color //Text Appearance styles <item name="textAppearanceSubtitle1">@style/TextAppearance.App.Subtitle1</item> <item name="textAppearanceCaption">@style/TextAppearance.App.Caption</item> <!--Note: When setting a materialThemeOverlay on a custom TextInputLayout style, don’t forget to set editTextStyle to either a @style/Widget.MaterialComponents.TextInputEditText.* style or to a custom one that inherits from that. The TextInputLayout styles set materialThemeOverlay that overrides editTextStyle with the specific TextInputEditText style needed. Therefore, you don’t need to specify a style tag on the edit text.--> <item name="editTextStyle">@style/Widget.MaterialComponents.TextInputEditText.OutlinedBox</item></style><style name="TextAppearance.App.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1"> <item name="fontFamily">@font/your_font</item> <item name="android:fontFamily">@font/your_font</item></style><style name="TextAppearance.App.Caption" parent="TextAppearance.MaterialComponents.Caption"> <item name="fontFamily">@font/your_font</item> <item name="android:fontFamily">@font/your_font</item></style><style name="ShapeAppearance.App.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent"> <item name="cornerFamily">cut</item> <item name="cornerSize">4dp</item></style>
Add the below line to your main theme or else you can set style to textinputlayout in your xml
<item name="textInputStyle">@style/Widget.App.TextInputLayout</item>
<style name="TextAppearance.App.TextInputLayout" parent="@android:style/TextAppearance"> <item name="android:textColor">@color/red</item> <item name="android:textSize">14sp</item></style><android.support.design.widget.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:textColorHint="@color/gray" //support 23.0.0 app:hintTextAppearance="@style/TextAppearence.App.TextInputLayout" > <android.support.v7.widget.AppCompatEditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="@string/hint" /></android.support.design.widget.TextInputLayout>
Found the answer, use android.support.design:hintTextAppearance
attribute to set your own floating label appearance.
Example:
<android.support.design.widget.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content" xmlns:app="http://schemas.android.com/apk/res-auto" app:hintTextAppearance="@style/TextAppearance.AppCompat"> <EditText android:id="@+id/password" android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="@string/prompt_password"/></android.support.design.widget.TextInputLayout>