So ändern Sie die inaktive Randstrichfarbe der Android Material TextInputLayout-Komponente

Dec 14 2020

Ich versuche, die nicht fokussierte Randstrichfarbe von TextInputLayout einzurichten. Für das gleiche gibt es zu viele Fragen und ihre Antworten und ich habe sie alle ausprobiert. Wie Erstellte Stile und als Thema verwendet, Erstellt Farbauswahl und wendete diese an, und auch direkt angewendet app: boxStrokeColor mit Farbauswahl. Aber kein Glück mit einer dieser verfügbaren Lösungen.

Ich bin mir nicht sicher, wo ich etwas falsch mache oder was mir noch fehlt. Ich habe meinen Code zum Testen des Projekts an github gesendet, um eine bessere Sichtbarkeit meines gesamten Setups zu erhalten. Hier ist ein Beispielcode zur schnellen Überprüfung:

activity_main.xml (TextInputLayout in 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 (Farbauswahl)

<?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>

Es wäre eine große Hilfe, wenn jemand eine Richtlinie und einen Vorschlag machen und mir helfen könnte, einen Fehler herauszufinden, den ich gemacht habe.

Danke im Voraus.

Antworten

1 MariosP Jan 08 2021 at 23:31

Ich habe Ihren Code getestet und er funktioniert, nachdem Sie die folgenden Änderungen vorgenommen haben:

1. Ändern Sie zuerst Ihre res / color / text_input_box_stroke_color.xml wie unten, um die verschiedenen Statusfarben anzuzeigen . Im folgenden Beispiel habe ich eine rote Farbe für den fokussierten Zustand und eine hellblaue Farbe für den standardmäßig inaktiven Zustand festgelegt:

<?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. Ändern Sie dann Ihre res / values / styles.xml mit der BoxStrokeColor , die wie folgt mit dem obigen Selektor verknüpft ist:

<?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. Fügen Sie schließlich in Ihrem TextInputLayout diesen Stil wie folgt hinzu:

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

Derzeit fügen Sie den folgenden Stil hinzu: android: theme = "@ style / TextInputLayoutStyle" anstelle von style = "@ style / TextInputLayoutStyle"

SlothCoding Jan 07 2021 at 05:52

Die Lösung dafür ist die nächste, und das funktioniert, weil ich es JETZT getestet habe.

Gehen Sie zu Ihrem colors.xmlin Ihrem res>valuesOrdner.

Dort haben Sie Ihre colorPrimaryund andere Farben, die Sie bereits zuvor erstellt haben. Scrollen Sie nach unten und fügen Sie diese Zeile hinzu:

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

Wenn Sie das tun, können Sie dort einfach die Farbe ändern. Ich habe definiert als, @color/colorPrimaryaber Sie können verwenden, was Sie wollen. Bevor ich diese Zeile anwendete, bekam ich Folgendes: