comment changer la couleur de l'étiquette de TextinputLayout et edittext soulignent android

J'utilise la bibliothèque de conception Android TextinputLayout. Mais ne pouvait pas personnaliser la couleur de l'indice, la couleur de l'étiquette et la couleur de soulignement de l' EditTextintérieur TextinputLayout. Veuillez aider.

Changer la couleur de la ligne du bas:

<item name="colorControlNormal">#c5c5c5</item>
<item name="colorControlActivated">@color/accent</item>
<item name="colorControlHighlight">@color/accent</item>

Pour plus d'informations, consultez ce fil .

Changer la couleur de l'indice lorsqu'il flotte

<style name="MyHintStyle" parent="@android:style/TextAppearance">
    <item name="android:textColor">@color/main_color</item>
</style>

et utilisez-le comme ceci:

<android.support.design.widget.TextInputLayout
    ...
    app:hintTextAppearance="@style/MyHintStyle">

Changez la couleur de l'indice lorsqu'il ne s'agit pas d'une étiquette flottante:

<android.support.design.widget.TextInputLayout
    ...
    app:hintTextAppearance="@style/MyHintStyle"
    android:textColorHint="#c1c2c4">

Merci à @AlbAtNf

Sur la base de Fedor Kazakov et d'autres réponses, j'ai créé une configuration par défaut.

styles.xml

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <style name="Widget.Design.TextInputLayout" parent="AppTheme">
        <item name="hintTextAppearance">@style/AppTheme.TextFloatLabelAppearance</item>
        <item name="errorTextAppearance">@style/AppTheme.TextErrorAppearance</item>
        <item name="counterTextAppearance">@style/TextAppearance.Design.Counter</item>
        <item name="counterOverflowTextAppearance">@style/TextAppearance.Design.Counter.Overflow</item>
    </style>

    <style name="AppTheme.TextFloatLabelAppearance" parent="TextAppearance.Design.Hint">
        <!-- Floating label appearance here -->
        <item name="android:textColor">@color/colorAccent</item>
        <item name="android:textSize">20sp</item>
    </style>

    <style name="AppTheme.TextErrorAppearance" parent="TextAppearance.Design.Error">
        <!-- Error message appearance here -->
        <item name="android:textColor">#ff0000</item>
        <item name="android:textSize">20sp</item>
    </style>

</resources>

activity_layout.xml

<android.support.design.widget.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <android.support.v7.widget.AppCompatEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Text hint here"
        android:text="5,2" />

</android.support.design.widget.TextInputLayout>

Concentré:

Sans focus:

Message d'erreur:

Avec la bibliothèque de composants matériels, vous pouvez utiliser le com.google.android.material.textfield.TextInputLayout.

Vous pouvez appliquer un style personnalisé pour modifier les couleurs.

Pour changer la couleur de l'indice, vous devez utiliser ces attributs:
hintTextColoret android:textColorHint.

<style name="Custom_textinputlayout_filledbox" parent="@style/Widget.MaterialComponents.TextInputLayout.FilledBox">
    <!-- 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/selector_hint_text_color</item>
</style>

Vous devez utiliser un sélecteur pour le android:textColorHint. Quelque chose comme:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:alpha="0.38" android:color="?attr/colorOnSurface" android:state_enabled="false"/>
  <item android:alpha="0.6" android:color="?attr/colorOnSurface"/>
</selector>

Pour changer la couleur de la ligne de fond , vous devez utiliser l'attribut: boxStrokeColor.

<style name="Custom_textinputlayout_filledbox" parent="@style/Widget.MaterialComponents.TextInputLayout.FilledBox">
    ....
    <item name="boxStrokeColor">@color/selector_stroke_color</item>
</style>

Dans ce cas également, vous devez utiliser un sélecteur. Quelque chose comme:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:color="?attr/colorPrimary" android:state_focused="true"/>
  <item android:alpha="0.87" android:color="?attr/colorOnSurface" android:state_hovered="true"/>
  <item android:alpha="0.12" android:color="?attr/colorOnSurface" android:state_enabled="false"/>
  <item android:alpha="0.38" android:color="?attr/colorOnSurface"/>
</selector>

Vous pouvez également appliquer ces attributs dans votre mise en page:

<com.google.android.material.textfield.TextInputLayout
    style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox"
    app:boxStrokeColor="@color/selector_stroke_color"
    app:hintTextColor="?attr/colorPrimary"
    android:textColorHint="@color/selector_hint_text_color"
    ...>

Ajoutez cet attribut dans la balise Edittext et profitez de:

 android:backgroundTint="@color/colorWhite"

Ce billet de blog décrit divers aspects de style EditTextet AutoCompleteTextViewenveloppé par TextInputLayout.

Pour EditTextet AppCompat lib 22.1.0+, vous pouvez définir l'attribut de thème avec certains paramètres liés au thème:

<style name="StyledTilEditTextTheme">
   <item name="android:imeOptions">actionNext</item>
   <item name="android:singleLine">true</item>
   <item name="colorControlNormal">@color/greyLight</item>
   <item name="colorControlActivated">@color/blue</item>
   <item name="android:textColorPrimary">@color/blue</item>
   <item name="android:textSize">@dimen/styledtil_edit_text_size</item>
</style>

<style name="StyledTilEditText">
    <item name="android:theme">@style/StyledTilEditTextTheme</item>
    <item name="android:paddingTop">4dp</item>
</style>

et appliquez-les sur EditText:

<EditText
    android:id="@+id/etEditText"
    style="@style/StyledTilEditText"

Car les AutoCompleteTextViewchoses sont plus compliquées car l'envelopper TextInputLayoutet appliquer ce thème rompt le comportement des étiquettes flottantes. Vous devez résoudre ce problème dans le code:

private void setStyleForTextForAutoComplete(int color) {
    Drawable wrappedDrawable =     DrawableCompat.wrap(autoCompleteTextView.getBackground());
    DrawableCompat.setTint(wrappedDrawable, color);
    autoCompleteTextView.setBackgroundDrawable(wrappedDrawable);
}

et en Activity.onCreate:

setStyleForTextForAutoComplete(getResources().getColor(R.color.greyLight));
autoCompleteTextView.setOnFocusChangeListener((v, hasFocus) -> {
    if(hasFocus) {
        setStyleForTextForAutoComplete(getResources().getColor(R.color.blue));
    } else {
        if(autoCompleteTextView.getText().length() == 0) {  
              setStyleForTextForAutoComplete(getResources().getColor(R.color.greyLight));
        }
    }
});

Si vous souhaitez modifier la couleur de la barre / ligne et la couleur du texte de l'indiceTextInputLayout (quelle est normalement la couleur d'accentuation), créez simplement ce style:

<style name="MyStyle">
    <item name="colorAccent">@color/your_color</item>
</style>

Ensuite, appliquez-le à votre TextInputLayoutcomme thème :

<android.support.design.widget.TextInputLayout
    ...
    app:theme="@style/MyStyle" />

Cela définit essentiellement un thème (et non un style) sur une vue (par opposition à l'ensemble de l'activité).

<style name="Widget.Design.TextInputLayout" parent="android:Widget">
    <item name="hintTextAppearance">@style/TextAppearance.Design.Hint</item>
    <item name="errorTextAppearance">@style/TextAppearance.Design.Error</item>
</style>

Vous pouvez remplacer ce style pour la mise en page

Et vous pouvez également modifier le style d'élément EditText interne.

<style name="EditScreenTextInputLayoutStyle" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorControlNormal">@color/actionBar_background</item>
    <item name="colorControlActivated">@color/actionBar_background</item>
    <item name="colorControlHighlight">@color/actionBar_background</item>
    <item name="colorAccent">@color/actionBar_background</item>
    <item name="android:textColorHint">@color/actionBar_background</item>
</style>

appliquer ce style à TextInputLayout

A TextinputLayoutn'est pas une vue, mais un Layout, comme très joliment décrit par Dimitrios Tsigouris dans son article de blog ici . Par conséquent, vous n'avez pas besoin d'un Style, qui est pour Viewsseulement, mais utilisez un Theme. Suite au billet de blog, je me suis retrouvé avec la solution suivante:

Commencez dans votre styles.xmlavec

<style name="TextInputLayoutAppearance" parent="Widget.Design.TextInputLayout">
        <!-- reference our hint & error styles -->
        <item name="android:textColor">@color/your_colour_here</item>
        <item name="android:textColorHint">@color/your_colour_here</item>
        <item name="colorControlNormal">@color/your_colour_here</item>
        <item name="colorControlActivated">@color/your_colour_here</item>
        <item name="colorControlHighlight">@color/your_colour_here</item>
</style>

Et dans votre mise en page ajoutez

<com.google.android.material.textfield.TextInputLayout
                android:theme="@style/TextInputLayoutAppearance"
...