Comment changer la couleur de contour de la bordure inactive du composant TextInputLayout de matériau Android

Dec 14 2020

J'essaie de configurer la couleur de contour non focalisée de TextInputLayout. Pour le même, il y a trop de questions et leurs réponses et je les ai toutes essayées. Comme Styles créés et utilisés comme thème, Sélecteur de couleurs créé et appliqué, et également appliqué directement app: boxStrokeColor avec sélecteur de couleur. Mais pas de chance avec l'une de ces solutions disponibles.

Je ne sais pas, où est-ce que je fais mal ou quelque chose qui me manque toujours. J'ai poussé mon code vers Test project vers github pour obtenir une meilleure visibilité de l'ensemble de ma configuration. Voici un exemple de code pour un examen rapide:

activity_main.xml (TextInputLayout à l'intérieur de ConstraintLayout)

<com.google.android.material.appbar.MaterialToolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <!-- Tried this as well - app:boxStrokeColor="@color/text_input_box_stroke_color" -->
    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/emailTextInputLayout"
        android:hint="Email"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="24dp"
        android:theme="@style/TextInputLayoutStyle"
        android:layout_marginHorizontal="24dp"
        app:layout_constraintTop_toBottomOf="@id/toolbar"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/emailTextInput"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:importantForAutofill="no"
            android:inputType="textEmailAddress" />

    </com.google.android.material.textfield.TextInputLayout>

styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="TextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
        <item name="boxStrokeColor">#FF00CC</item>
        <item name="boxStrokeWidth">2dp</item>
    </style>
</resources>

text_input_box_stroke_color.xml (sélecteur de couleur)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/mtrl_textinput_focused_box_stroke_color" android:state_focused="true"/>
    <item android:color="@color/mtrl_textinput_hovered_box_stroke_color" android:state_hovered="true"/>
    <item android:color="@color/mtrl_textinput_disabled_color" android:state_enabled="false"/>
    <item android:color="@color/mtrl_textinput_default_box_stroke_color"/>
</selector>

Ce serait très utile si quelqu'un pouvait me donner des directives et des suggestions et m'aider à comprendre toute erreur que j'ai commise.

Merci d'avance.

Réponses

1 MariosP Jan 08 2021 at 23:31

J'ai testé votre code et cela fonctionne après avoir effectué les modifications ci-dessous:

1.Changez d'abord votre res / color / text_input_box_stroke_color.xml comme ci-dessous pour voir les différentes couleurs des états. Dans l'exemple ci-dessous, j'ai défini une couleur rouge pour l'état focalisé et une couleur bleu clair pour l'état inactif par défaut:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@android:color/holo_red_dark" android:state_focused="true" />
    <item android:color="@android:color/holo_green_dark" android:state_hovered="true" />
    <item android:color="@color/mtrl_textinput_disabled_color" android:state_enabled="false" />
    <item android:color="@android:color/holo_blue_light" />
</selector>

2.Ensuite, modifiez votre res / values / styles.xml avec le lien boxStrokeColor vers le sélecteur ci-dessus comme ci-dessous:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="TextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
        <item name="boxStrokeColor">@color/text_input_box_stroke_color</item>
        <item name="boxStrokeWidth">2dp</item>
    </style>
</resources>

3.Enfin, dans votre TextInputLayout, ajoutez ce style comme ci-dessous:

<com.google.android.material.textfield.TextInputLayout
    style="@style/TextInputLayoutStyle"
    android:id="@+id/emailTextInputLayout"

Actuellement, vous ajoutez le style comme: android: theme = "@ style / TextInputLayoutStyle" au lieu de style = "@ style / TextInputLayoutStyle"

SlothCoding Jan 07 2021 at 05:52

La solution pour cela est la suivante, et cela fonctionne parce que je viens de le tester.

Accédez à votre colors.xmldans votre res>valuesdossier.

Vous y trouverez vos colorPrimarycouleurs et d'autres que vous avez déjà créées auparavant. Faites défiler vers le bas et ajoutez cette ligne:

<color name="mtrl_textinput_default_box_stroke_color" tools:override="true">@color/colorPrimary</color>

Lorsque vous faites cela, vous pouvez simplement changer la couleur là-bas. J'ai défini comme @color/colorPrimarymais vous pouvez utiliser ce que vous voulez. Avant d'appliquer cette ligne, j'ai obtenu ceci: