Cách thay đổi màu nét viền không hoạt động của thành phần TextInputLayout của Android Material
Tôi đang cố gắng thiết lập màu nét viền không tập trung TextInputLayout. Tương tự, có quá nhiều câu hỏi và câu trả lời của họ và tôi đã thử tất cả chúng. Giống như Kiểu đã tạo và được sử dụng làm chủ đề, Bộ chọn màu đã tạo và áp dụng điều đó, đồng thời áp dụng trực tiếp ứng dụng: boxStrokeColor với bộ chọn màu. Nhưng không may mắn với bất kỳ giải pháp có sẵn nào.
Không chắc, tôi đang làm sai ở đâu hoặc điều gì đó tôi vẫn còn thiếu. Tôi đã đẩy mã của mình cho Dự án thử nghiệm lên github để hiển thị tốt hơn toàn bộ thiết lập của tôi. Đây là một số mã mẫu để xem xét nhanh:
activity_main.xml (TextInputLayout bên trong 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 (công cụ chọn màu)
<?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>
Sẽ rất hữu ích nếu ai đó có thể cung cấp một số hướng dẫn và gợi ý và giúp tôi tìm ra bất kỳ sai lầm nào của tôi.
Cảm ơn trước.
Trả lời
Tôi đã kiểm tra mã của bạn và nó hoạt động sau khi bạn thực hiện các thay đổi dưới đây:
1.Đầu tiên thay đổi res / color / text_input_box_stroke_color.xml của bạn như bên dưới để xem các màu trạng thái khác nhau. Trong ví dụ dưới đây, tôi đã đặt màu Đỏ cho trạng thái được lấy nét và màu Xanh nhạt cho trạng thái không hoạt động mặc định:
<?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.Sau đó, thay đổi res / values / styles.xml của bạn bằng liên kết boxStrokeColor với bộ chọn ở trên như bên dưới:
<?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>
Cuối cùng, trong TextInputLayout của bạn, hãy thêm kiểu này như sau:
<com.google.android.material.textfield.TextInputLayout
style="@style/TextInputLayoutStyle"
android:id="@+id/emailTextInputLayout"
Hiện tại, bạn đang thêm kiểu như: android: theme = "@ style / TextInputLayoutStyle" thay vì style = "@ style / TextInputLayoutStyle"
Giải pháp cho điều này là tiếp theo, và điều này hoạt động bởi vì tôi CHỈ NGAY BÂY GIỜ đã thử nghiệm nó.
Đi tới colors.xmlbên trong res>valuesthư mục của bạn .
Trong đó, bạn sẽ có colorPrimarymàu của bạn và các màu khác mà bạn đã tạo trước đó. Cuộn xuống dưới cùng và thêm dòng này:
<color name="mtrl_textinput_default_box_stroke_color" tools:override="true">@color/colorPrimary</color>
Khi bạn làm điều đó, bạn chỉ có thể thay đổi màu sắc ở đó. Tôi đã định nghĩa là @color/colorPrimarynhưng bạn có thể sử dụng bất cứ thứ gì bạn muốn. Trước khi áp dụng dòng này, tôi nhận được điều này:
Và sau khi áp dụng dòng đó, đây là kết quả:
Ngoài ra, tôi đã áp dụng style="@style/YourStyle"cho cả hai TextInputLayoutvàTextInputEditText
Tạo màu nét hộp cho trạng thái hoạt động và không hoạt động như bên dưới: 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>
Tạo kiểu TextInputLayout : TextInputLayoutStyle
<style name="TextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
<item name="boxStrokeColor">@color/box_stroke_color</item>
<item name="boxStrokeWidth">1dp</item>
</style>
Sử dụng trong TextInputLayout của bạn
<com.google.android.material.textfield.TextInputLayout
style="@style/TextInputLayoutStyle" >
<com.google.android.material.textfield.TextInputEditText.. />
</com.google.android.material.textfield.TextInputLayout>