【问题标题】:Set TextInputLayout floating hint color as Outline color将 TextInputLayout 浮动提示颜色设置为轮廓颜色
【发布时间】:2021-06-21 06:15:22
【问题描述】:

我正在使用 MaterialComponents Outline TextInputLayout。我需要在提示文本上设置不同的颜色:

  • “main”提示(当 TextInput 中没有文本时)-->黑色,60% alpha
  • 浮动提示 --> 与轮廓颜色相同(即不活动时为 colorPrimary,活动时为 colorAccent)

我正在使用 android:textColorHint 设置主要提示颜色,并使用 app:hintTextColor 设置浮动提示颜色。唉,这最后一个属性似乎只有在 TextInputLayout 处于活动状态时才有效。如果它处于非活动状态,则浮动提示采用 android:textColorHint 颜色。

我目前的配置

layout.xml

<com.google.android.material.textfield.TextInputLayout
android:id="@+id/td_descriptionH_editText"
style="@style/Widget.App.TextInputLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:hint="@string/td_description">

<com.google.android.material.textfield.TextInputEditText
    android:id="@+id/td_description_editText"
    style="@style/Widget.App.TextInput"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

styles.xml

<style name="Widget.App.TextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="android:textColorHint">@color/black_inactive</item>
    <item name="hintTextColor">?attr/drawableEditTextOutline</item>
    <item name="boxStrokeColor">?attr/drawableEditTextOutline</item>
</style>

drawableEditTextOutline.xml

<selector>
    <item android:color="@color/colorPrimary" android:state_focused="true"/>
    <item android:color="@color/colorAccent"/>
</selector>

TextInputLayout active 没问题(浮动提示与轮廓颜色相同)

没有文字的TextInputLayout不活动是可以的

TextInputLayout inactive with text is KO -->浮动提示与轮廓颜色不同

我怎样才能做到这一点?

【问题讨论】:

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


    【解决方案1】:

    你可以使用类似的东西:

    <style name="CustomOutlineBox" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
        <item name="boxStrokeColor">@color/text_input_layout_stroke_color</item>
        <item name="android:textColorHint">@color/text_color_hint</item>
        <item name="hintTextColor">@color/green</item>
    </style>
    

    使用@color/text_color_hint 选择器:

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:alpha="..." android:color="@color/red" android:state_enabled="false"/>
        <item android:alpha="..." android:color="@color/blue"/>
    </selector>
    

    还有@color/text_input_layout_stroke_color selector:

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:alpha="..." android:color="@color/green" android:state_focused="true"/>
        <item android:alpha="..." android:color="@color/green" android:state_hovered="true"/>
        <item android:alpha="..." android:color="@color/red" android:state_enabled="false"/>
        <item android:alpha="..." android:color="@color/blue"/>  <!-- unfocused -->
    </selector>
    

    【讨论】:

    • 我仍然无法为主要提示和浮动未聚焦提示提供不同的颜色。无论如何,您的解决方案非常适合,所以我去。
    【解决方案2】:

    TextInputLayout 必须包含 textColorHint 属性才能获得所需的结果

    <com.google.android.material.textfield.TextInputLayout
    
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:hint="@string/txt_email"
                        android:padding="5dp"
                        android:textColorHint="@color/white"
                        app:hintTextColor="@color/white">
    

    【讨论】:

    • 我有。该属性的样式为 Widget.App.TextInputLayout,与 TextInputLayout 相关联
    猜你喜欢
    • 1970-01-01
    • 2018-11-21
    • 1970-01-01
    • 2020-06-05
    • 1970-01-01
    • 1970-01-01
    • 2015-08-15
    • 1970-01-01
    • 2019-11-23
    相关资源
    最近更新 更多