Cara mengubah warna guratan batas tidak aktif dari komponen Android Material TextInputLayout

Dec 14 2020

Saya mencoba menyiapkan warna guratan batas tidak fokus TextInputLayout. Untuk hal yang sama, Ada terlalu banyak pertanyaan dan jawabannya dan saya telah mencoba semuanya. Seperti gaya yang dibuat dan digunakan sebagai tema, Selektor warna dibuat dan diterapkan, dan juga diterapkan secara langsung app: boxStrokeColor dengan pemilih warna. Tapi tidak beruntung dengan solusi yang tersedia ini.

Tidak yakin, di mana saya melakukan kesalahan atau sesuatu yang masih saya lewatkan. Saya memasukkan kode saya ke Test project ke github untuk mendapatkan visibilitas yang lebih baik dari seluruh pengaturan saya. Berikut beberapa contoh kode untuk tinjauan cepat:

activity_main.xml (TextInputLayout di dalam 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 (pemilih warna)

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

Akan sangat membantu jika seseorang dapat memberikan beberapa pedoman dan saran dan membantu saya mengetahui kesalahan yang saya buat.

Terima kasih sebelumnya.

Jawaban

1 MariosP Jan 08 2021 at 23:31

Saya telah menguji kode Anda dan berfungsi setelah Anda melakukan perubahan di bawah ini:

1. Pertama ubah res / color / text_input_box_stroke_color.xml Anda seperti di bawah ini untuk melihat warna status yang berbeda. Dalam contoh di bawah ini, saya telah menetapkan warna Merah untuk status fokus dan warna Biru Muda untuk status tidak aktif default:

<?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. Kemudian ubah res / values ​​/ styles.xml Anda dengan link boxStrokeColor ke selektor di atas seperti di bawah ini:

<?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. Terakhir di TextInputLayout Anda, tambahkan gaya ini seperti di bawah ini:

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

Saat ini Anda menambahkan gaya seperti: android: theme = "@ style / TextInputLayoutStyle" bukan style = "@ style / TextInputLayoutStyle"

SlothCoding Jan 07 2021 at 05:52

Solusi untuk ini adalah berikutnya, dan ini berhasil karena SAYA BARU SAJA mengujinya.

Masuk ke colors.xmldalam res>valuesfolder Anda .

Di sana Anda akan memiliki colorPrimarywarna Anda dan warna lain yang sudah Anda buat sebelumnya. Gulir ke bawah dan tambahkan baris ini:

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

Saat Anda melakukan itu, Anda tinggal mengubah warnanya di sana. Saya mendefinisikan sebagai @color/colorPrimarytetapi Anda dapat menggunakan apa pun yang Anda inginkan. Sebelum menerapkan baris ini, saya mendapatkan ini:

Dan setelah menerapkan garis itu, inilah hasilnya:

Juga saya melamar style="@style/YourStyle"keduanya TextInputLayoutdanTextInputEditText

AslamHossin Jan 09 2021 at 16:11

Buat warna guratan kotak untuk status aktif dan tidak aktif seperti di bawah ini: 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>

Buat gaya TextInputLayout : TextInputLayoutStyle

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

Gunakan di TextInputLayout Anda

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