web-dev-qa-db-fra.com

Couleur de l'indice TextInputLayout en état d'erreur

Selon les directives matérielles de Googles:

https://material.io/guidelines/components/text-fields.html#text-fields-layout

L'indicateur TextInputLayout doit être de la même couleur que le message d'erreur:

 enter image description here

Cependant, ce n'est pas comme ça et quand j'appelle setError("My error"), seul le soulignement et le message d'erreur apparaissent en rouge.

Comment puis-je modifier ce comportement pour tenir compte des directives de Google?

8
MichelReap

voici comment vous pouvez le faire

 <Android.support.design.widget.TextInputLayout
        Android:padding="8dp"
        Android:id="@+id/tilSample"
        app:errorTextAppearance="@style/error_appearance"
        app:hintTextAppearance="@style/error_appearance"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content">

        <EditText
            Android:id="@+id/etSample"
            Android:layout_margin="8dp"
            Android:padding="8dp"
            Android:hint="Android"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content" />

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

style.xml

<style name="error_appearance" parent="@Android:style/TextAppearance">
        <item name="Android:textColor">@color/colorRed</item>
        <item name="Android:textSize">12sp</item>
    </style>

couleurs.xml

   <?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
    <color name="colorRed">#f44336</color>
</resources>

MODIFIER

nous pouvons manipuler les couleurs d'erreur et d'indice dans le code en utilisant également

tilSample.setErrorTextAppearance(R.style.error_appearance);  
tilSample.setHintTextAppearance(R.style.error_appearance);
11
vikas kumar

C'est maintenant le comportement par défaut. Pour ce faire, il vous suffit de mettre à jour votre version de la bibliothèque de support technique à 28+.

implementation 'com.Android.support:design:28.0.0'
2
snersesyan
  1. TextInputLayout en XML

        <Android.support.design.widget.TextInputLayout
            Android:layout_width="match_parent"
            Android:id="@+id/tx_login_password"
            app:errorEnabled="true"
            style="@style/text_input_style"
            app:passwordToggleEnabled="true"
            app:hintTextAppearance="@style/text_Apearence"
            Android:layout_below="@id/tx_login_username"
            Android:layout_centerHorizontal="true"
            app:theme="@style/Theme.App.Base"
            Android:layout_marginLeft="70dp"
            Android:layout_marginStart="70dp"
            Android:layout_marginRight="70dp"
            Android:layout_marginEnd="70dp"
            app:errorTextAppearance="@style/text_Apearence"
            Android:layout_height="wrap_content">
            <Android.support.v7.widget.AppCompatEditText
                Android:layout_width="match_parent"
                Android:layout_marginTop="10dp"
                Android:layout_height="wrap_content"
                Android:hint="Password"
                Android:paddingTop="5dp"
                Android:typeface="sans"
                Android:textStyle="bold"
                Android:textSize="15sp"
                Android:maxLines="1"
                Android:inputType="textPassword"
                Android:lines="1"
                Android:elegantTextHeight="true"
                Android:textAlignment="viewStart"
                Android:layout_gravity="start"
                Android:id="@+id/password"
                Android:theme="@style/Theme.App.Base"
                app:theme="@style/Theme.App.Base"
                style="@style/EditText_style"
                />
        </Android.support.design.widget.TextInputLayout>
    
  2. text_Apearence dans le fichier style.xml de resourses

<style name="text_Apearence" parent="TextAppearance.Design.Hint">
    <item name="Android:textSize">15sp</item>
        <item name="textColor">@color/react_blue</item>
        <item name="Android:colorActivatedHighlight">@color/react_blue</item>
        <item name="Android:colorControlActivated">@color/react_blue</item>
    </style>
   

 1.  3. Style for Text Input Layout text_input_style XML file

<!-- begin snippet: js hide: false console: true babel: false -->

  1. Style pour la mise en page de texte fichier XML text_input_style

<style name="text_Apearence" parent="TextAppearance.Design.Hint">
    <item name="Android:textSize">15sp</item>
        <item name="textColor">@color/react_blue</item>
        <item name="Android:colorActivatedHighlight">@color/react_blue</item>
        <item name="Android:colorControlActivated">@color/react_blue</item>
    </style>

L'image ressemble à

0
Mallikarjuna
Here is an example:

 <Android.support.design.widget.TextInputLayout
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:id="@+id/email_layout"
                Android:textColorHint="@color/gray"
                app:errorTextAppearance="@style/TextAppearence.App.TextInputLayout"
                app:hintTextAppearance="@style/TextAppearence.App.TextInputLayout">

                <Android.support.design.widget.TextInputEditText
                    Android:id="@+id/et_email"
                    style="@style/TextStyle"
                    Android:layout_width="match_parent"
                    Android:layout_height="wrap_content"
                    Android:layout_marginLeft="20dp"
                    Android:layout_marginRight="20dp"
                    Android:cursorVisible="true"
                    Android:gravity="center|left|bottom"
                    Android:hint="@string/email"
                    Android:inputType="textEmailAddress"
                    Android:maxLength="50"
                    Android:paddingBottom="10dp"
                    Android:textColor="@color/black_effective"
                    Android:textSize="18sp" />

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

Style File:

   <style name="TextAppearence.App.TextInputLayout" parent="@Android:style/TextAppearance">
        <item name="Android:textColor">@color/gray</item>
    </style>

Snapshot:

 In image : TextInputLayout hint should be the same color as the Error message

0
Rahil Ali