使用 TextInputLayout 时更改 EditText 提示颜色
Posted
技术标签:
【中文标题】使用 TextInputLayout 时更改 EditText 提示颜色【英文标题】：Change EditText hint color when using TextInputLayout 【发布时间】：2015-08-29 16:47:34 【问题描述】：我正在使用设计库中的新 TextInputLayout。我能够让它显示并更改浮动标签的颜色。不幸的是，实际的EditText 提示现在总是白色的。
我尝试过更改 XML、样式和编程方式中的提示颜色，还尝试使用 android.support.v7.widget.AppCompatEditText
但EditText 提示始终显示为白色。
这是我的 TextInputLayout 和 EditText 的 XML
<android.support.design.widget.TextInputLayout
android:layout_
android:layout_
android.support.design:hintTextAppearance="@style/GreenTextInputLayout">
<EditText
android:layout_
android:layout_
android:id="@+id/city"
android:textColorHint="@color/black"
android:hint="@string/city" />
</android.support.design.widget.TextInputLayout>
这是我用于TextInputLayout 的样式（我尝试将hintTextColor 属性设为黑色，但没有为我做任何事情）：
<style name="GreenTextInputLayout" parent="@style/TextAppearance.AppCompat">
<item name="android:textColor">@color/homestory_green</item>
</style>
【问题讨论】：
我面临同样的错误。在触摸任何 editText 后，提示始终为“白色”颜色，它采用您定义的颜色。仍在寻找修复程序。 您尝试过@Ali Kabiri 的答案吗？看起来这是一个比我更好的解决方案。我的项目非常具体。 我有我的自定义主题，所有颜色都在 style.xml 中定义 【参考方案1】：这里是谷歌材料文本输入布局的完整定制。这可能对你有帮助
<com.google.android.material.textfield.TextInputLayout
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_
android:layout_
android:layout_marginHorizontal="@dimen/_24sdp"
android:layout_marginTop="@dimen/_24sdp"
android:hint="@string/username"
android:textColorHint="@color/tint"
app:hintEnabled="true"
app:hintAnimationEnabled="false"
app:startIconDrawable="@drawable/ic_user"
app:startIconTint="@color/tint"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/guideline"
app:boxCornerRadiusBottomEnd="@dimen/_45sdp"
app:boxCornerRadiusBottomStart="@dimen/_45sdp"
app:boxCornerRadiusTopEnd="@dimen/_45sdp"
app:boxCornerRadiusTopStart="@dimen/_45sdp"
app:boxStrokeColor="@color/red"
app:boxStrokeWidth="@dimen/_1sdp"
<!-- for password
app:passwordToggleEnabled="true"
app:passwordToggleTint="@color/tint" -->
>
<com.google.android.material.textfield.TextInputEditText
android:layout_
android:layout_
android:padding="0dp"
android:fontFamily="@font/poppins_medium"
android:textColor="@color/black"
android:inputType="textEmailAddress"/>
</com.google.android.material.textfield.TextInputLayout>
【讨论】：
【参考方案2】：使用TextInputLayout.setDefaultHintTextColor
【讨论】：
【参考方案3】：我只想在标签被提升到顶部时更改标签颜色。但是设置textColorHint 会改变每个状态的颜色。所以，这对我有用：
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
...
<item name="colorControlActivated">@color/colorPrimary</item>
...
</style>
这将在输入获得焦点时改变颜色。
【讨论】：
【参考方案4】：如果您使用的是材料设计库。目前，我使用的是版本
实现 'com.google.android.material:material:1.3.0-alpha01'
1 - 在 TextInputLayout 静止时设置颜色。
<item name="android:textColorHint">@color/your_color_hint</item>
2 - 在 TextInputLayout 浮动/聚焦/点击时设置颜色。
<item name="hintTextColor">@color/your_color_floating_hint</item>
3 - 设置 TextInputLayout 下的线条颜色。
<item name="boxStrokeColor">@color/TextViewColor_line</item>
4 - 在 TextInputLayout 下设置错误的颜色。
<item name="boxStrokeErrorColor">@color/colorPrimary</item>
【讨论】：
【参考方案5】：来自文档：
提示应该设置在 TextInputLayout，而不是 EditText。如果在 XML 中的子 EditText 上指定了提示，TextInputLayout 可能仍然可以正常工作； TextInputLayout 将使用 EditText 的提示作为其浮动标签。但是，将来修改提示的调用不会更新 TextInputLayout 的提示。为避免意外行为，请在 TextInputLayout 上而不是在 EditText 上调用 setHint(CharSequence) 和 getHint()。
尝试将android:hint 和app:hintTextColor 设置为TextInputLayout 而不是TextInputEditText。
【讨论】：
【参考方案6】：如果你正在使用新的 androidx 材料设计库com.google.android.material
然后您可以使用 colorstatelist 来控制提示文本颜色处于聚焦、悬停和默认状态，如下所示。 （灵感来自this）
在res/color/text_input_box_stroke.xml 中输入如下内容：
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#fcc" android:state_focused="true"/>
<item android:color="#cfc" android:state_hovered="true"/>
<item android:color="#ccf"/>
</selector>
然后在您的styles.xml 中输入：
<style name="MtTILStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
<item name="boxStrokeColor">@color/text_input_box_stroke</item>
<item name="hintTextColor">@color/text_input_box_stroke</item>
</style>
最后在实际TextInputLayout中表明你的风格
出于某种原因，您还需要将android:textColorHint 设置为提示的默认文本颜色：
<com.google.android.material.textfield.TextInputLayout
android:id="@+id/my_layout_id"
style="@style/LoginTextInputLayoutStyle"
android:textColorHint="#ccf"
...
【讨论】：
【参考方案7】：当我尝试将主题属性设置为 TextInputLayout 时，主题也被应用到它的子视图 edittext，这是我不想要的。
所以对我有用的解决方案是向 TextInputLayout 的“app:hintTextAppearance”属性添加自定义样式。
在styles.xml中添加如下样式：
<style name="TextInputLayoutTextAppearance" parent="TextAppearance.AppCompat">
<item name="android:textColor">@color/text_color</item>
<item name="android:textSize">@dimen/text_size_12</item>
</style>
并将此样式应用于 TextInputLayout 的“app:hintTextAppearance”属性，如下所示：
<com.google.android.material.textfield.TextInputLayout
android:id="@+id/mobile_num_til"
android:layout_
android:layout_
app:layout_constraintStart_toStartOf="@id/title_tv"
app:layout_constraintEnd_toEndOf="@id/title_tv"
app:layout_constraintTop_toBottomOf="@id/sub_title_tv"
android:layout_marginTop="@dimen/dim_30"
android:padding="@dimen/dim_8"
app:hintTextAppearance="@style/TextInputLayoutTextAppearance"
android:background="@drawable/rect_round_corner_grey_outline">
<com.google.android.material.textfield.TextInputEditText
android:id="@+id/mobile_num_et"
android:layout_
android:layout_
android:hint="@string/mobile_number"
android:gravity="center_vertical"
android:background="@android:color/transparent"/>
</com.google.android.material.textfield.TextInputLayout>
【讨论】：
【参考方案8】：使用Material Components library，您可以使用以下方法自定义TextInputLayout 提示文本颜色：
在布局中：
app:hintTextColor 属性：标签折叠且文本字段处于活动状态时的颜色
android:textColorHint 属性：标签在所有其他文本字段状态（如休息和禁用）下的颜色
类似：
<com.google.android.material.textfield.TextInputLayout
app:hintTextColor="@color/mycolor"
android:textColorHint="@color/text_input_hint_selector"
.../>
【讨论】：
真的很有帮助。【参考方案9】：这是我对这个类似问题的经验和所需的解决方案。
要求：
需要创建自定义TextInputEditText（可以说有些应该是透明的，有些应该不是，但对各种事件使用自定义颜色）
面临的问题：
android:textColorHint 没有按要求工作。
尝试了解决方案，但失败了：
在样式中使用android:textColorHint 并应用于TextInputEditText。没有结果或差异。
在应用程序的主题中设置android:textColorHint。它确实有帮助，但现在已为整个应用程序设置。 （未达到要求）
在大量 RnD 之后，发现最好的解决方案是在一篇文章中，该文章描述了我们需要将 theme 应用于 TextInputLayout 或其父视图，而不是仅应用 style 到TextInputEditText 或它的父视图。
请检查TextInputLayout proper Theming，它告诉我们我们是如何走错路的。
【讨论】：
【参考方案10】：晚了，但它可能会帮助我做过这样的人
<android.support.design.widget.TextInputLayout
android:layout_
android:layout_
android:layout_centerInParent="true"
android:layout_marginLeft="30dp"
android:layout_marginStart="30dp"
android:textColorHint="#8cffffff">
<android.support.v7.widget.AppCompatEditText
android:id="@+id/email_edit"
android:layout_
android:layout_
android:hint="@string/security_email"
android:inputType="textEmailAddress"
android:textColor="@color/white"
app:backgroundTint="#8cffffff" />
</android.support.design.widget.TextInputLayout>
【讨论】：
【参考方案11】：试试下面的代码：
高光颜色为白色：
<android.support.design.widget.TextInputLayout
android:id="@+id/input_layout_mobile"
android:layout_
android:layout_
android:theme="@style/TextStyle"
>
<EditText
android:id="@+id/input_mobile"
android:layout_
android:layout_
android:singleLine="true"
android:drawablePadding="14dp"
android:drawableLeft="8dp"
android:textColor="@color/white"
android:hint="Mobile" />
</android.support.design.widget.TextInputLayout>
样式：文本样式
<style name="TextStyle" parent="TextAppearance.AppCompat">
<!-- Hint color and label color in FALSE state -->
<item name="android:textColorHint">@color/white</item>
<item name="android:textSize">20sp</item>
<!-- Label color in TRUE state and bar color FALSE and TRUE State -->
<item name="colorAccent">@color/white</item>
<item name="colorControlNormal">@color/white</item>
<item name="colorControlActivated">@color/white</item>
</style>
【讨论】：
【参考方案12】： <android.support.design.widget.TextInputLayout
android:id="@+id/input_layout_passdword"
android:layout_
android:layout_
android:textColorHint="#d3d3d3">
<EditText
android:id="@+id/etaddrfess_ciwty"
android:layout_
android:layout_
android:background="@android:color/transparent"
android:bottomLeftRadius="10dp"
android:bottomRightRadius="50dp"
android:fontFamily="@font/frutiger"
android:gravity="start"
android:hint="@string/address_city"
android:padding="10dp"
android:textColor="#000000"
android:textColorHint="#000000"
android:textSize="14sp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp" />
</android.support.design.widget.TextInputLayout>``
【讨论】：
【参考方案13】：您可以在TextInputlayout 中使用android:textColorHint="@color/color_black" 它对我有用。
<android.support.design.widget.TextInputLayout
android:layout_
android:layout_
android:layout_marginTop="@dimen/dp_10"
android:textColorHint="@color/color_black"
app:hintTextAppearance="@style/TextLabel">
<EditText
android:id="@+id/et_state"
style="@style/profile_editTextStyle"
android:layout_
android:layout_
android:hint="@string/billingState"
android:text="@string/billingState"
/>
</android.support.design.widget.TextInputLayout>
【讨论】：
【参考方案14】：很多答案，但只需要一行：
android:textColorHint="#000000"
<EditText
android:id="@+id/edtEmail"
android:textColorHint="#000000"
android:layout_
android:layout_/>
【讨论】：
【参考方案15】：您必须在 TextInputLayout 上设置提示颜色。
【讨论】：
【参考方案16】：<item name="colorAccent">@android:color/black</item>
将您的 colorAccent 更改为您在主题中所需的颜色，这将更改您的 EditText 行、光标以及您的提示
或者你也可以在你的 style.xml 中包含这个样式
<style name="TextLabel" parent="TextAppearance.AppCompat">
<!-- Hint color and label color in FALSE state -->
<item name="android:textColorHint">@android:color/black</item>
<item name="android:textSize">20sp</item>
<!-- Label color in TRUE state and bar color FALSE and TRUE State -->
<item name="colorAccent">@android:color/black</item>
<item name="colorControlNormal">@android:color/black</item>
<item name="colorControlActivated">@android:color/black</item>
</style>
然后在您的 TextInputLayout 中，您可以这样放置
<android.support.design.widget.TextInputLayout
android:id="@+id/input_layout_password"
android:layout_
android:layout_
android:theme="@style/TextLabel">
<EditText
android:layout_
android:layout_
android:drawableLeft="@drawable/password"
android:drawableStart="@drawable/password"
android:maxLines="1"
android:hint="password"
android:inputType="textWebPassword" />
</android.support.design.widget.TextInputLayout>
【讨论】：
【参考方案17】：android:textColorHint="#FFFFFF" 有时有效，有时无效。对我来说，以下解决方案非常有效
试试下面的代码，它在你的 XML 文件中工作，TextLabel 主题在 style.xml 中定义
<android.support.design.widget.TextInputLayout
android:layout_
android:layout_
android:theme="@style/MyTextLabel">
<EditText
android:layout_
android:layout_
android:hint="Floating Label"
android:id="@+id/edtText"/>
</android.support.design.widget.TextInputLayout>
在样式文件夹中的 TextLabel 代码
<style name="MyTextLabel" parent="TextAppearance.AppCompat">
<!-- Hint color and label color in FALSE state -->
<item name="android:textColorHint">@color/Color Name</item>
<!--The size of the text appear on label in false state -->
<item name="android:textSize">20sp</item>
<!-- Label color in TRUE state and bar color FALSE and TRUE State -->
<item name="colorAccent">@color/Color Name</item>
<item name="colorControlNormal">@color/Color Name</item>
<item name="colorControlActivated">@color/Color Name</item>
</style>
如果你只是想在 false 状态下改变标签的颜色，那么 colorAccent 、 colorControlNormal 和 colorControlActivated 不是必需的
【讨论】：
【参考方案18】：将 textColorHint 属性添加到您的编辑文本中
android:textColorHint="#F6F6F6"
或者你想要的任何颜色
【讨论】：
这是我一直在寻找的简单答案。谢谢。【参考方案19】：在 style.xml 中创建 自定义 样式
<style name="EditTextHint" parent="TextAppearance.AppCompat">
<item name="colorAccent">@android:color/white</item>
<item name="android:textColorHint">@color/BackgroundtWhiteColor</item>
<item name="colorControlNormal">@color/BackgroundtWhiteColor</item>
<item name="colorControlActivated">@color/your color</item>
<item name="colorControlHighlight">@color/BackgroundtWhiteColor</item>
</style>
然后在您的布局 xml 文件中，添加 theme 属性，如下所示
<android.support.design.widget.TextInputLayout
android:theme="@style/EditTextHint"
android:layout_
android:layout_>
<EditText
android:layout_
android:layout_/>
</android.support.design.widget.TextInputLayout>
希望这可行
【讨论】：
显示“膨胀类 EditText 时出错”。请帮忙！ @Coder他添加的一些属性是针对21+的【参考方案20】：据此： https://code.google.com/p/android/issues/detail?id=176559
试试这个：
<android.support.design.widget.TextInputLayout
android:textColorHint="#A7B7C2"
android:layout_
android:layout_>
<EditText
android:id="@+id/et_confirm_password"
android:textColor="@android:color/black"
android:hint="Confirm password"
android:inputType="textPassword"
android:layout_
android:layout_ />
</android.support.design.widget.TextInputLayout>
它适用于 23.1.1
【讨论】：
【参考方案21】：遇到了同样的问题。通过将这些行放在 parent 主题中解决。
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">@color/ColorPrimaryDark</item>
<item name="colorPrimaryDark">@color/ColorPrimaryDark</item>
<item name="colorAccent">@color/AccentColor</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="android:textColorHint">@color/BackgroundtWhiteColor</item>
<item name="colorControlNormal">@color/BackgroundtWhiteColor</item>
<item name="colorControlActivated">#ff0000</item>
<item name="colorControlHighlight">@color/BackgroundtWhiteColor</item>
<!-- Customize your theme here. -->
</style>
如果你把这些
<item name="android:textColorHint">@color/BackgroundtWhiteColor</item>
<item name="colorControlNormal">@color/BackgroundtWhiteColor</item>
<item name="colorControlActivated">#ff0000</item>
<item name="colorControlHighlight">@color/BackgroundtWhiteColor</item>
以单独的样式并将其应用于 TextInputLayout 或 Edittext 它不会出现。您必须将其放置在应用程序的父主题中。
【讨论】：
使用这个小部件不能在应用程序中拥有多种输入样式真的很令人沮丧，但据我所知，你是对的。 :// 好吧，没有必要在整个应用程序中都有它。您只能将此主题应用于清单文件中的一个活动。并为您的其余活动创建另一个主题。【参考方案22】：在保存EditText的TextInputLayout中，添加：
android:textColorHint="someColor"
【讨论】：
【参考方案23】：请参考下面对我有用的代码。但它会影响你所有的控件颜色。
<!-- In your style.xml file -->
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<!--EditText hint color-->
<item name="android:textColorHint">@color/default_app_white</item>
<!-- TextInputLayout text color-->
<item name="colorControlActivated">@color/default_app_green</item>
<!-- EditText line color when EditText on-focus-->
<item name="colorControlHighlight">@color/default_app_green</item>
<!-- EditText line color when EditText in un-focus-->
<item name="colorControlNormal">@color/default_app_white</item>
</style>
【讨论】：
这应该被接受 - 它显示了哪些属性被用于每个重要的元素。【参考方案24】： <android.support.design.widget.TextInputLayout
android:layout_
android:layout_>
<EditText
android:id="@+id/name"
android:layout_
android:layout_
android:hint="Name"
android:textColor="@color/black"
android:textColorHint="@color/grey"/>
</android.support.design.widget.TextInputLayout>
使用 textColorHint 将您想要的颜色设置为 EditText 的提示颜色。问题是 EditText 中的提示不是在您键入内容时消失，而是在 EditText 获得焦点时立即消失（带有很酷的动画）。当您将焦点转移到 EditText 时，您会清楚地注意到这一点。
【讨论】：
【参考方案25】：试试这个可能会有帮助
edittext.addTextChangedListener(new TextWatcher()
@Override
public void onTextChanged(CharSequence s, int start, int before, int count)
// TODO Auto-generated method stub
Toast.makeText(getApplicationContext(), "onTextChanged", 2000).show();;
//newuser.setTextColor(Color.RED);
edittext.setHintTextColor(Color.RED);
@Override
public void beforeTextChanged(CharSequence s, int start, int count,
int after)
// TODO Auto-generated method stub
@Override
public void afterTextChanged(Editable s)
// TODO Auto-generated method stub
Toast.makeText(getApplicationContext(), "afterTextChanged", 2000).show();;
);
【讨论】：
为什么把它放在 onTextChanged 监听器中？【参考方案26】：在您的应用程序主题中定义android:textColorHint：
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<item name="colorPrimary">@color/primary</item>
<item name="colorPrimaryDark">@color/primary_dark</item>
<item name="colorAccent">@color/accent</item>
<item name="android:textColorHint">@color/secondary_text</item>
</style>
Source
【讨论】：
@TheHungryAndroider 您是否将主题设置为您使用编辑文本的活动主题？ 它适用于我，但提示的颜色未在片段和视图创建时设置，我必须单击我的EditText 才能在视图中的所有输入上设置提示颜色...还没有找到任何解决方法（requestFocus() 和 performClick() 不幸的是不要这样做）。
用作属性时起作用：看起来父视图具有导致 EditText 为白色的第 3 方库的样式。
android:theme="@style/com_mixpanel_android_SurveyActivityTheme"
一旦我删除了它，一切正常。
【讨论】：
【参考方案28】：我不确定是什么导致了您的问题，所以这段代码对我来说非常有效。我认为这与使用正确的 xml 命名空间（xmlns）有关。我不确定是否支持使用没有 xml 命名空间属性的 android.support.design。或者它与您在 EditText 本身上使用的 textColorHint 属性有关。
布局：
<android.support.design.widget.TextInputLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_
android:layout_
android:layout_marginTop="5dp"
app:hintTextAppearance="@style/GreenTextInputLayout">
<android.support.v7.widget.AppCompatEditText
android:layout_
android:layout_
android:hint="test"
android:inputType="text" />
</android.support.design.widget.TextInputLayout>
风格：
<style name="GreenTextInputLayout" parent="@android:style/TextAppearance">
<item name="android:textColor">#00FF00</item>
</style>
【讨论】：
这仍然像我所拥有的那样工作。我遇到的问题是，在用户触摸 EditText 之前，EditText 颜色是白色的。当用户触摸 EditText 时，TextInputLayout 标签为绿色且工作正常。 @user3520299 也有同样的问题，能找到解决办法吗？ 我的是一个独特的案例，因为父视图有一个导致问题的主题集。但是在我删除了一个主题后，我提出的代码现在可以正常工作了 这适用于浮动提示，但不适用于空 EditText 控件内的提示。为此，请按照@mbelsky's answer 更新应用程序主题 顺便说一下，默认的 app:hintTextAppearance 样式是@style/TextAppearance.Design.Hint，所以您可能希望将其用作您的 parent 而不是 @android:style/TextAppearance 或 @style/TextAppearance.AppCompat以上是关于使用 TextInputLayout 时更改 EditText 提示颜色的主要内容，如果未能解决你的问题，请参考以下文章
调用 recreate() 方法时 TextInputLayout 提示不会刷新