Jak zmienić nieaktywny kolor obrysu obramowania składnika TextInputLayout w systemie Android

Dec 14 2020

Próbuję ustawić nieokreślony kolor obrysu obramowania TextInputLayout. Z tego samego powodu jest zbyt wiele pytań i ich odpowiedzi, a wypróbowałem je wszystkie. Podobnie jak Utworzone style i używane jako motyw, Utworzono selektor kolorów i zastosowałem to, a także zastosowałem bezpośrednio app: boxStrokeColor z selektorem kolorów. Ale nie powodzenia z żadnym z tych dostępnych rozwiązań.

Nie wiem, gdzie robię źle lub coś, czego wciąż mi brakuje. Wysłałem kod do projektu Test na github, aby uzyskać lepszą widoczność całej mojej konfiguracji. Oto przykładowy kod do szybkiego przeglądu:

activity_main.xml (TextInputLayout wewnątrz 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>

style.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 (selektor koloru)

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

Byłoby bardzo pomocne, gdyby ktoś udzielił mi wskazówek i sugestii oraz pomógł mi zrozumieć każdy mój błąd.

Z góry dziękuję.

Odpowiedzi

1 MariosP Jan 08 2021 at 23:31

Przetestowałem Twój kod i działa po wykonaniu poniższych zmian:

1. Najpierw zmień swój res / color / text_input_box_stroke_color.xml jak poniżej, aby zobaczyć kolory w różnych stanach. W poniższym przykładzie ustawiłem kolor czerwony dla stanu skupienia i jasnoniebieski dla stanu domyślnego nieaktywności:

<?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.Następnie zmień plik res / values ​​/ styles.xml za pomocą boxStrokeColor z linkiem do powyższego selektora, jak poniżej:

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

Na koniec dodaj do swojego TextInputLayout następujący styl:

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

Obecnie dodajesz styl, taki jak: android: theme = "@ style / TextInputLayoutStyle" zamiast style = "@ style / TextInputLayoutStyle"

SlothCoding Jan 07 2021 at 05:52

Rozwiązanie tego problemu jest następne i działa, ponieważ JUŻ TERAZ je przetestowałem.

Przejdź do colors.xmlswojego res>valuesfolderu.

Tam będziesz mieć swój colorPrimaryi inne kolory, które wcześniej stworzyłeś. Przewiń w dół i dodaj tę linię:

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

Kiedy to zrobisz, możesz po prostu zmienić kolor. Zdefiniowałem, @color/colorPrimaryże możesz używać wszystkiego, co chcesz. Przed zastosowaniem tej linii otrzymałem to:

A po zastosowaniu tej linii jest to wynik:

Złożyłem również wniosek style="@style/YourStyle"o oba TextInputLayoutiTextInputEditText

AslamHossin Jan 09 2021 at 16:11

Utwórz kolor obrysu ramki dla stanu aktywnego i nieaktywnego, jak poniżej: box_stroke_color

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="#2C2C2C" android:state_focused="true"/>
    <item android:color="#2C2C2C" android:state_hovered="true"/>
    <item android:color="#D7D7D7"/>
</selector>

Utwórz styl TextInputLayout : TextInputLayoutStyle

 <style name="TextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
        <item name="boxStrokeColor">@color/box_stroke_color</item>
        <item name="boxStrokeWidth">1dp</item>
    </style>

Użyj w swoim TextInputLayout

 <com.google.android.material.textfield.TextInputLayout
    style="@style/TextInputLayoutStyle" >
    <com.google.android.material.textfield.TextInputEditText.. />
 </com.google.android.material.textfield.TextInputLayout>