当前位置: 首页 > 知识库问答 >
问题:

Android:TextInputLayout--为提示、底线和错误消息定制颜色

百里渊
2023-03-14

我的布局如下所示:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/email_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/email"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="E-mail"
            android:imeOptions="actionDone"
            android:inputType="textEmailAddress"
            android:maxLines="1" />

    </com.google.android.material.textfield.TextInputLayout>

</LinearLayout>

当我验证用户输入时,如果输入无效,我会添加一条错误消息,如下所示:

email_container.setError("You must fill this field!");

结果是:

https://stackoverflow.com/a/46765159

https://stackoverflow.com/a/33709380

...和其他解决方案试图解决android.support.design.widget.TextInputLayout包装简单的edittext时的情况。

email_container.setError("You must fill this field!");
email_container.setErrorTextColor(new ColorStateList(states, colors));
email_container.setDefaultHintTextColor(new ColorStateList(statesHint, colorsHint));

// Also tried with other states, but nothing
int[][] states = new int[][] {
        new int[] { android.R.attr.state_enabled},
        new int[] {-android.R.attr.state_enabled},
};

int[][] statesHint = new int[][] {
        new int[] { android.R.attr.state_enabled},
        new int[] {-android.R.attr.state_enabled},
};


int[] colors = new int[] {
        R.color.yellow,
        R.color.green,
};


int[] colorsHint = new int[] {
        R.color.black90,
        R.color.bt_text_blue,
};

有人知道怎么处理这个吗?

共有1个答案

阮雅达
2023-03-14

我们可以自定义样式来自定义TextInputLayout颜色。尝试此代码根据您的需要更改TextInputLayout颜色代码

style.xml

<style name="TextInputCustonColor" 
  parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
    <!-- The color of the label  -->
    <item name="android:textColorHint">@color/colorPrimaryGolden</item>
    <!-- The color of the label -->
    <item name="android:colorError" tools:targetApi="o">@color/colorError</item>
    <!--the color of text-->
    <item name="android:textColor">@color/colorPrimaryGolden</item>
    <!--the color of background-->
    <item name="boxBackgroundColor">@android:color/transparent</item>

</style>

activity.xml

    <android.support.design.widget.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card_view:errorEnabled="true"
    style="@style/TextInputCustonColor">

    <android.support.design.widget.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Password"
        style="@style/TextInputCustonColor"
        android:imeOptions="actionDone"
        android:inputType="textEmailAddress"
        android:maxLines="1" />

</android.support.design.widget.TextInputLayout>
 类似资料:
  • 我在支持库的文本输入中包含了一个编辑文本,我发现无法使提示出现在字段的中心。我已经尝试了在其他堆栈溢出讨论中发现的所有常用技巧,正如您从代码示例中看到的那样,但提示仍然顽固地出现在编辑文本的左侧。我该如何解决这个问题? 请不要建议使用paddingLeft或paddingStart来做到这一点——我想要一些能够在不同设备上干净地工作的东西,所以它必须是一个直接的解决方案,而不是一个变通办法。 需要

  • 介绍 在页面顶部展示消息提示,支持函数调用和组件调用两种方式。 函数调用 Notify 是一个函数,调用后会直接在页面中弹出相应的消息提示。 import { Notify } from 'vant'; Notify('通知内容'); 组件调用 通过组件调用 Notify 时,可以通过下面的方式进行注册(从 2.8.5 版本开始支持): import { createApp } from 'v

  • Toast 消息提示 基本使用 以下为一个模拟登录成功后,弹出toast提示,并在一定时间(默认2000ms)后,自动跳转页面到个人中心页(也可以配置跳转的参数)的示例 <template> <view> <u-toast ref="uToast" /> </view> </template> <script> export default { methods: { show

  • 常用于主动操作后的反馈提示。与 Notification 的区别是后者更多用于系统级通知的被动提醒。 基础用法 从顶部出现,3 秒后自动消失。 Message 在配置上与 Notification 非常类似,所以部分 options 在此不做详尽解释,文末有 options 列表,可以结合 Notification 的文档理解它们。Element Plus 注册了一个$message方法用于调用,

  • Message 消息提示 常用于主动操作后的反馈提示。与 Notification 的区别是后者更多用于系统级通知的被动提醒。 基础用法 从顶部出现,3 秒后自动消失。 :::demo Message 在配置上与 Notification 非常类似,所以部分 options 在此不做详尽解释,文末有 options 列表,可以结合 Notification 的文档理解它们。 open() {

  • 常用于主动操作后的反馈提示。与 Notification 的区别是后者更多用于系统级通知的被动提醒。 基础用法 从顶部出现,3 秒后自动消失。 ElMessageService 仅仅是一个服务, 不需要在模板中注册任何组件插槽,它会创建一个虚拟组件用于显示,并且在合适的时候注销。你完全不用担心模板与生命周期的问题。 <!--你可以从 [element-angular] 中引入 ElMessageS