CODEWITHSUNDEEP
androidmaterial-designandroid-textinputlayout
Morteza Rastgoo
Morteza Rastgoo

Reputation: 6986

How to change material TextInputLayout OutlinedBox unfocused Color

I have an OutlinedBox TextInputLayout and I want to change the box color in the unfocused mode of editText.

How can I do that?

enter image description here

Upvotes: 6

Views: 2882

Answers (1)

Morteza Rastgoo
Morteza Rastgoo

Reputation: 6986

In the theme Add colorOnSurface attribute and assign any color you want

<style name="Apptheme"
       parent="Theme.MaterialComponents.Light.NoActionBar">
    <!-- General theme colors -->
    <item name="colorPrimary">@color/material_green_500</item>
    <item name="colorSecondary">@color/material_green_600</item>
    <item name="colorAccent">@color/illiniColorAccent</item>

    <item name="colorOnSurface">@color/blue</item><!--inputtext unfocused color-->
</style>

The result is: enter image description here Also colorPrimary is the color of focused state.

Other attributes you can customize are:

<item name="enforceMaterialTheme">true</item>
<item name="enforceTextAppearance">true</item>

<item name="boxBackgroundMode">outline</item>
<item name="boxBackgroundColor">@null</item>
<item name="endIconTint">@color/mtrl_outline_end_icon_tint</item>
<item name="boxCollapsedPaddingTop">0dp</item>
<item name="boxCornerRadiusTopStart">@dimen/mtrl_textinput_box_corner_radius_medium</item>
<item name="boxCornerRadiusTopEnd">@dimen/mtrl_textinput_box_corner_radius_medium</item>
<item name="boxCornerRadiusBottomEnd">@dimen/mtrl_textinput_box_corner_radius_medium</item>
<item name="boxCornerRadiusBottomStart">@dimen/mtrl_textinput_box_corner_radius_medium</item>
<item name="boxStrokeColor">@color/mtrl_outlined_stroke_color</item>

<item name="counterTextAppearance">?attr/textAppearanceCaption</item>
<item name="counterOverflowTextAppearance">?attr/textAppearanceCaption</item>
<item name="errorTextAppearance">?attr/textAppearanceCaption</item>
<item name="helperTextTextAppearance">?attr/textAppearanceCaption</item>
<item name="hintTextAppearance">?attr/textAppearanceCaption</item>

<item name="counterTextColor">@color/mtrl_indicator_text_color</item>
<item name="counterOverflowTextColor">@color/mtrl_error</item>
<item name="errorTextColor">@color/mtrl_error</item>
<item name="helperTextTextColor">@color/mtrl_indicator_text_color</item>
<!-- The color of the label when it is collapsed and the text field is active -->
<item name="hintTextColor">?attr/colorPrimary</item>
<!-- The color of the label in all other text field states (such as resting and disabled) -->
<item name="android:textColorHint">@color/mtrl_indicator_text_color</item>

<item name="shapeAppearance">?attr/shapeAppearanceSmallComponent</item>
<item name="shapeAppearanceOverlay">@null</item>

Upvotes: 9

Related Questions