在启用和禁用的视图中使用自定义提示文本颜色作为提示

时间:2019-07-08 16:09:05

标签: android material-design android-styles android-textinputlayout

我正在尝试将自定义样式添加到TextInputLayout和TextInputEditText,但是我无法获得预期的结果。 我需要的是在启用的视图中使用自定义颜色“ A”作为提示,在禁用的视图中使用自定义颜色“ B”作为提示。

现在,我有一个带有选择器的样式,用于启用/禁用提示。这是样式:

<style name="CustomTextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
    <item name="boxStrokeColor">@color/input_blue</item>
    <item name="boxStrokeWidth">2dp</item>
    <item name="errorTextAppearance">@style/ErrorText</item>
    <item name="android:textColorHint">@color/selector_edithintcolor</item>
</style>

这里是选择器,您可以看到颜色来说明问题: enter image description here

现在布局中的一些组件:

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/layout_text_disabled"
    style="@style/CustomTextInputLayoutStyle"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="32dp"
    android:layout_marginTop="32dp"
    android:layout_marginEnd="32dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@id/layout_phone_not_focused">

    <com.google.android.material.textfield.TextInputEditText
        android:id="@+id/txt_text_disabled"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/hint_deactivated"
        android:inputType="text"
        android:text="@string/txt_disabled" />
</com.google.android.material.textfield.TextInputLayout>

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/layout_text_disabled_hint"
    style="@style/CustomTextInputLayoutStyle"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="32dp"
    android:layout_marginTop="32dp"
    android:layout_marginEnd="32dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@id/layout_text_disabled">

    <com.google.android.material.textfield.TextInputEditText
        android:id="@+id/txt_text_disabled_hint"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/hint_deactivated"
        android:inputType="text" />
</com.google.android.material.textfield.TextInputLayout>

此外,我还有一个按钮可以将这两个视图的状态从启用更改为禁用,这是行为:

启用视图后,所有内容均符合预期,根据选择器,提示的颜色为绿色: Hints are showing green enabled color, which is OK

现在,当我禁用视图时,这就是我得到的: Hints show the default color when disabled, not OK

根据选择器,是否有任何使禁用提示变为橙色的想法?预先感谢!

2 个答案:

答案 0 :(得分:1)

在遵循此link之后,com.google.android.material:material的1.2.0-alpha03版本现在似乎可以使用 您需要像这样创建一个颜色状态列表:

box_stroke_color_state_list.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="?colorPrimary" android:state_enabled="true" />
    <item android:color="?colorSecondary" android:state_hovered="true" />
    <item android:color="?colorSecondary" android:state_focused="true" />
    <!-- This is where the disable hint and box will take it's color -->
    <item android:alpha="@dimen/material_emphasis_disabled" android:color="@android:color/holo_green_dark" android:state_enabled="false" />
    <item android:color="@color/mtrl_textinput_default_box_stroke_color" />
</selector>

,然后在您的代码中调用它:

ContextCompat.getColorStateList(context, R.color.box_stroke_color_state_list)?.let {
    layout_text_disabled_hint.setBoxStrokeColorStateList(it)
}

enter image description here

答案 1 :(得分:0)

基于@Caktuspace答复,您可以通过以下方式申请:

layout.xml

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/til"
    ...
    android:hint="@string/hello"
    android:textColorHint="@color/hint_text_color_textinputlayout">

hint_text_color_textinputlayout.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="@dimen/material_emphasis_disabled" android:color="@color/desiredColorDisabled" android:state_enabled="false" />
    <item android:color="@color/desiredColorEnabled" />
</selector>