227

参考TextInputLayout谷歌新发布的，如何更改浮动标签文字颜色？

在样式中设置colorControlNormal, colorControlActivated,colorControlHighLight没有帮助。

这就是我现在所拥有的：

这就是我现在所拥有的

4

25 回答 25

377

试试下面的代码它在正常状态下工作

 <android.support.design.widget.TextInputLayout
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:theme="@style/TextLabel">

     <android.support.v7.widget.AppCompatEditText
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:hint="Hiiiii"
         android:id="@+id/edit_id"/>

 </android.support.design.widget.TextInputLayout>

在样式文件夹中的 TextLabel 代码

 <style name="TextLabel" parent="TextAppearance.AppCompat">
    <!-- Hint color and label color in FALSE state -->
    <item name="android:textColorHint">@color/Color Name</item> 
    <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>

设置为应用程序的主题，它仅适用于仅突出显示状态

 <item name="colorAccent">@color/Color Name</item>

更新：

UnsupportedOperationException: Can't convert to color: type=0x2 in api 16 or below

解决方案

更新：

您是否在使用材料组件库

您可以将以下几行添加到您的主题中

 <item name="colorPrimary">@color/your_color</item> // Activated State
 <item name="colorOnSurface">@color/your_color</item> // Normal State

或者您是否希望在正常状态和激活状态下使用不同的颜色以及自定义以下代码

<style name="Widget.App.TextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="materialThemeOverlay">@style/ThemeOverlay.App.TextInputLayout</item>
    <item name="shapeAppearance">@style/ShapeAppearance.App.SmallComponent</item> //Changes the Shape Apperance
    <!--<item name="hintTextColor">?attr/colorOnSurface</item>-->   //When you added this line it will applies only one color in normal and activate state i.e colorOnSurface color
</style>

<style name="ThemeOverlay.App.TextInputLayout" parent="">
    <item name="colorPrimary">@color/colorPrimaryDark</item>  //Activated color
    <item name="colorOnSurface">@color/colorPrimary</item>    //Normal color
    <item name="colorError">@color/colorPrimary</item>        //Error color

    //Text Appearance styles
    <item name="textAppearanceSubtitle1">@style/TextAppearance.App.Subtitle1</item>
    <item name="textAppearanceCaption">@style/TextAppearance.App.Caption</item>

    <!--Note: When setting a materialThemeOverlay on a custom TextInputLayout style, don’t forget to set editTextStyle to either a @style/Widget.MaterialComponents.TextInputEditText.* style or to a custom one that inherits from that.
    The TextInputLayout styles set materialThemeOverlay that overrides editTextStyle with the specific TextInputEditText style needed. Therefore, you don’t need to specify a style tag on the edit text.-->
    <item name="editTextStyle">@style/Widget.MaterialComponents.TextInputEditText.OutlinedBox</item>
</style>

<style name="TextAppearance.App.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1">
    <item name="fontFamily">@font/your_font</item>
    <item name="android:fontFamily">@font/your_font</item>
</style>

<style name="TextAppearance.App.Caption" parent="TextAppearance.MaterialComponents.Caption">
    <item name="fontFamily">@font/your_font</item>
    <item name="android:fontFamily">@font/your_font</item>
</style>

<style name="ShapeAppearance.App.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent">
    <item name="cornerFamily">cut</item>
    <item name="cornerSize">4dp</item>
</style>

将以下行添加到您的主题中，否则您可以在 xml 中将样式设置为 textinputlayout

<item name="textInputStyle">@style/Widget.App.TextInputLayout</item>
于 2015-06-18T11:24:52.057 回答
108 
<style name="TextAppearance.App.TextInputLayout" parent="@android:style/TextAppearance">
    <item name="android:textColor">@color/red</item>
    <item name="android:textSize">14sp</item>
</style>

<android.support.design.widget.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textColorHint="@color/gray"  //support 23.0.0
    app:hintTextAppearance="@style/TextAppearence.App.TextInputLayout" >

    <android.support.v7.widget.AppCompatEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/hint" />
</android.support.design.widget.TextInputLayout>
于 2015-06-01T03:34:12.503 回答
70

找到答案，使用android.support.design:hintTextAppearance属性设置自己的浮动标签外观。

例子：

<android.support.design.widget.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    app:hintTextAppearance="@style/TextAppearance.AppCompat">

    <EditText
        android:id="@+id/password"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/prompt_password"/>
</android.support.design.widget.TextInputLayout>
于 2015-05-30T15:30:04.467 回答
50

如何更改浮动标签文本颜色？

使用材料组件库，您可以TextInputLayout使用自定义提示文本颜色（它需要版本 1.1.0）

  • 在布局中：

  • app:hintTextColor属性：标签在折叠并且文本字段处于活动状态时的颜色

  • android:textColorHint属性：标签在所有其他文本字段状态下的颜色（例如resting和disabled）

<com.google.android.material.textfield.TextInputLayout
     app:hintTextColor="@color/mycolor"
     android:textColorHint="@color/text_input_hint_selector"
     .../>
  • 扩展材质风格 Widget.MaterialComponents.TextInputLayout.*：
<style name="MyFilledBox" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
    <item name="hintTextColor">@color/mycolor</item>
    <item name="android:textColorHint">@color/text_input_hint_selector</item>
</style>

在此处输入图像描述在此处输入图像描述

默认选择器android:textColorHint是：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:alpha="0.38" android:color="?attr/colorOnSurface" android:state_enabled="false"/>
  <item android:alpha="0.6" android:color="?attr/colorOnSurface"/>
</selector>
于 2019-09-05T18:53:58.250 回答
24

您不需要使用android:theme="@style/TextInputLayoutTheme"更改浮动标签颜色，因为它会影响用作标签的小 TextView 的整个主题。相反，您可以使用app:hintTextAppearance="@style/TextInputLayout.HintText"where：

<style name="TextInputLayout.HintText">
  <item name="android:textColor">?attr/colorPrimary</item>
  <item name="android:textSize">@dimen/text_tiny_size</item>
  ...
</style>

让我知道解决方案是否有效:-)

于 2017-08-31T18:59:11.063 回答
5

好的，所以，我发现这个答案非常有帮助，并感谢所有做出贡献的人。不过，只是为了添加一些东西。接受的答案确实是正确的答案......但是......在我的情况下，我希望在EditText小部件下方实现错误消息，app:errorEnabled="true"而这一行让我的生活变得困难。似乎这覆盖了我选择的主题android.support.design.widget.TextInputLayout，它具有不同的文本颜色，由android:textColorPrimary.

最后，我将文本颜色直接应用于EditText小部件。我的代码看起来像这样：

styles.xml

<item name="colorPrimary">@color/my_yellow</item>
<item name="colorPrimaryDark">@color/my_yellow_dark</item>
<item name="colorAccent">@color/my_yellow_dark</item>
<item name="android:textColorPrimary">@android:color/white</item>
<item name="android:textColorSecondary">@color/dark_gray</item>
<item name="android:windowBackground">@color/light_gray</item>
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="android:textColorHint">@color/dark_gray</item>
<item name="android:colorControlNormal">@android:color/black</item>
<item name="android:colorControlActivated">@android:color/white</item>

还有我的小部件：

<android.support.design.widget.TextInputLayout
        android:id="@+id/log_in_layout_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:errorEnabled="true">

        <EditText
            android:id="@+id/log_in_name"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:textColor="@android:color/black"
            android:ems="10"
            android:hint="@string/log_in_name"
            android:inputType="textPersonName" />
</android.support.design.widget.TextInputLayout>

现在它显示黑色文本颜色而不是textColorPrimary白色。

于 2015-10-05T09:39:42.583 回答
5

以编程方式，您可以使用：

/* Here you get int representation of an HTML color resources */
int yourColorWhenEnabled = ContextCompat.getColor(getContext(), R.color.your_color_enabled);
int yourColorWhenDisabled = ContextCompat.getColor(getContext(), R.color.your_color_disabled);

/* Here you get matrix of states, I suppose it is a matrix because using a matrix you can set the same color (you have an array of colors) for different states in the same array */
int[][] states = new int[][]{new int[]{android.R.attr.state_enabled}, new int[]{-android.R.attr.state_enabled}};

/* You pass a ColorStateList instance to "setDefaultHintTextColor" method, remember that you have a matrix for the states of the view and an array for the colors. So the color in position "colors[0x0]" will be used for every states inside the array in the same position inside the matrix "states", so in the array "states[0x0]". So you have "colors[pos] -> states[pos]", or "colors[pos] -> color used for every states inside the array of view states -> states[pos] */
myTextInputLayout.setDefaultHintTextColor(new ColorStateList(states, new int[]{yourColorWhenEnabled, yourColorWhenDisabled})

解释：

从颜色资源中获取 int 颜色值（一种呈现 android 使用的 rgb 颜色的方法）。我写了 ColorEnabled，但对于这个答案，实际上应该是 ColorHintExpanded 和 ColorViewCollapsed。无论如何，这是当视图“TextInputLayout”的提示处于展开或折叠状态时您将看到的颜色；您将通过在视图的函数“setDefaultHintTextColor”上使用下一个数组来设置它。参考： TextInputLayout 参考 - 在此页面中搜索方法“setDefaultHintTextColor”以获取更多信息

查看上面的文档，您可以看到函数通过使用 ColorStateList 为展开和折叠提示设置颜色。

颜色状态列表文档

为了创建 ColorStateList，我首先创建了一个包含我想要的状态的矩阵，在我的情况下是 state_enabled 和 state_disabled（在 TextInputLayout 中，它们等于 Hint Expanded 和 Hint Collapsed [我不记得按哪个顺序大声笑，反正我找到了只是做一个测试]）。然后我将颜色资源的 int 值的数组传递给 ColorStateList 的构造函数，这些颜色与状态矩阵有对应关系（颜色数组中的每个元素对应于状态矩阵中相同位置的相应数组）。所以颜色数组的第一个元素将用作状态矩阵的第一个数组中每个状态的颜色（在我们的例子中，数组只有一个元素：启用状态 = TextInputLayut 的提示扩展状态）。最后的事情状态有正/负值，而你只有正值，

希望这会有所帮助。再见有一个很好的编码（：

于 2019-12-13T12:49:19.747 回答
3

我建议您为 TextInputLayout 制作样式主题并仅更改强调色。将 parent 设置为您的应用基础主题：

 <style name="MyTextInputLayout" parent="MyAppThemeBase">
     <item name="colorAccent">@color/colorPrimary</item>
 </style>

 <android.support.design.widget.TextInputLayout
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:theme="@style/MyTextInputLayout">
于 2015-10-23T12:34:29.200 回答
2

在最新版本的支持库（23.0.0+）中，TextInputLayout采用 XML 中的以下属性来编辑浮动标签颜色：android:textColorHint="@color/white"

于 2015-11-26T16:06:37.107 回答
2

我更喜欢使用 Widget.Design.TextInputLayout 作为父级，而不是 Brahmam Yamani 的回答。这确保了所有必需的项目都存在，即使不是所有项目都被覆盖。在 Yamanis 的回答中，如果调用 setErrorEnabled(true)，应用程序将因无法解析的资源而崩溃。

只需将样式更改为以下内容：

<style name="TextLabel" parent="Widget.Design.TextInputLayout">
    <!-- Hint color and label color in FALSE state -->
    <item name="android:textColorHint">@color/Color Name</item> 
    <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>
于 2018-02-08T10:41:42.660 回答
1

更改提示颜色和编辑文本下划线颜色：colorControlActivated

更改字符计数器颜色：textColorSecondary

更改错误消息颜色：colorControlNormal

更改密码可见性按钮颜色：colorForeground

有关 TextInputLayout 的更多信息，请阅读http://www.zoftino.com/android-textinputlayout-tutorial

<style name="MyAppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorControlActivated">#e91e63</item>
    <item name="android:colorForeground">#33691e</item>
    <item name="colorControlNormal">#f57f17</item>
    <item name="android:textColorSecondary">#673ab7</item>
</style>
于 2017-10-11T03:58:01.967 回答
1

在我的情况下，我app:hintTextAppearance="@color/colorPrimaryDark"在我的 TextInputLayout 小部件中添加了这个“。

于 2018-07-12T00:23:58.330 回答
0

你应该在这里改变你的颜色

<style name="Base.Theme.DesignDemo" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">#673AB7</item>
        <item name="colorPrimaryDark">#512DA8</item>
        <item name="colorAccent">#FF4081</item>
        <item name="android:windowBackground">@color/window_background</item>
    </style>
于 2015-06-01T13:00:37.267 回答
0

现在，只需使用colorAccentand即可colorPrimary完美运行。

于 2015-06-11T03:27:19.243 回答
0

我解决问题。这是布局：</p> 

 <android.support.design.widget.TextInputLayout
           android:id="@+id/til_username"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:hint="@string/username"
           >

           <android.support.v7.widget.AppCompatEditText android:id="@+id/et_username"
               android:layout_width="match_parent"
               android:layout_height="wrap_content"
               android:singleLine="true"
               />
       </android.support.design.widget.TextInputLayout>

这是风格：

<style name="AppBaseTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!--
            Theme customizations available in newer API levels can go in
            res/values-vXX/styles.xml, while customizations related to
            backward-compatibility can go here.
        -->
    </style>
<!-- Application theme. -->


 <style name="AppTheme" parent="AppBaseTheme">
        <!-- All customizations that are NOT specific to a particular API-level can go here. -->
        <item name="colorAccent">@color/pink</item>
        <item name="colorControlNormal">@color/purple</item>
        <item name="colorControlActivated">@color/yellow</item>
    </style>

您应该在应用程序中使用您的主题：

<application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
</application>
于 2016-02-16T02:36:04.780 回答
0

当您专注于它时更改文本标签的颜色。即输入它。你必须添加指定

<item name="android:textColorPrimary">@color/yourcolorhere</item>

请注意：您必须将所有这些实现添加到您的主题中。

于 2017-08-05T07:36:41.613 回答
0

它为我工作.....在 TextInputLayout 中添加提示颜色

    <android.support.design.widget.TextInputLayout
        android:textColorHint="#ffffff"
        android:id="@+id/input_layout_password"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <EditText
            android:id="@+id/edtTextPassword"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="15dp"
            android:hint="Password"
            android:inputType="textPassword"
            android:singleLine="true"
            />
    </android.support.design.widget.TextInputLayout>
于 2017-08-28T05:56:42.290 回答
0

我尝试在 android.support.design.widget.TextInputLayout 中使用 android:textColorHint 它工作正常。

        <android.support.design.widget.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColorHint="@color/colorAccent">

            <EditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Hello"
                android:imeActionLabel="Hello"
                android:imeOptions="actionUnspecified"
                android:maxLines="1"
                android:singleLine="true"/>

        </android.support.design.widget.TextInputLayout>
于 2018-01-06T12:22:25.547 回答
0 
  <style name="AppTheme2" parent="AppTheme">
    <!-- Customize your theme here. -->
    <item name="colorControlNormal">#fff</item>
    <item name="colorControlActivated">#fff</item></style>

将此添加到样式并将 TextInputLayout Theam 设置为 App2 ，它将起作用；）

于 2018-02-06T00:02:10.877 回答
0 
<com.google.android.material.textfield.TextInputLayout
    android:hint="Hint"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/TextInputLayoutHint">

    <androidx.appcompat.widget.AppCompatEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="text"
        android:maxLines="1"
        android:paddingTop="@dimen/_5sdp"
        android:paddingBottom="@dimen/_5sdp"
        android:textColor="#000000"
        android:textColorHint="#959aa6" />

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

res/values/styles.xml

<style name="TextInputLayoutHint" parent="">
    <item name="android:textColorHint">#545454</item>
    <item name="colorControlActivated">#2dbc99</item>
    <item name="android:textSize">11sp</item>
</style>
于 2019-07-29T09:22:33.047 回答
0

用的app:hintTextColor话可以用com.google.android.material.textfield.TextInputLayout，试试这个

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

     <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />
 </com.google.android.material.textfield.TextInputLayout>
于 2019-10-26T23:40:54.707 回答
0

试试下面的代码它在正常状态下工作

<android.support.design.widget.TextInputLayout
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:theme="@style/TextLabel">

 <android.support.v7.widget.AppCompatEditText
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:hint="Hiiiii"
     android:id="@+id/edit_id"/>


</android.support.design.widget.TextInputLayout>

在样式文件夹中的 TextLabel 代码

 <style name="TextLabel" parent="TextAppearance.AppCompat">
<!-- Hint color and label color in FALSE state -->
<item name="android:textColorHint">@color/Color Name</item> 
<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>
于 2020-01-27T12:52:34.107 回答
0

从文档中：

提示应设置在 TextInputLayout，而不是 EditText。如果在 XML 中的子 EditText 上指定了提示，TextInputLayout 可能仍然可以正常工作；TextInputLayout 将使用 EditText 的提示作为其浮动标签。但是，将来修改提示的调用不会更新 TextInputLayout 的提示。为避免意外行为，请在 TextInputLayout 上而不是在 EditText 上调用 setHint(CharSequence) 和 getHint()。

所以我设置android:hint并app:hintTextColor打开TextInputLayout，而不是打开TextInputEditText并且它起作用了。

于 2020-05-11T07:21:43.520 回答
0

因为您必须将colorControlNormal, colorControlActivated,colorControlHighLight项目添加到主应用程序主题：

<!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>

        <item name="colorControlActivated">@color/yellow_bright</item>
        <item name="colorControlNormal">@color/yellow_black</item>

    </style>
于 2020-05-16T16:23:59.227 回答
0

这很简单，但由于多个视图在不同的配置/命名空间中具有相同的属性，因此开发人员会感到困惑。

在 TextInputLayout 的情况下，我们每次都有不同的视图和参数，要么使用 TextInputEditText，要么直接使用 TextInputLayout。

我正在使用上述所有修复：但我发现我正在使用

                app:textColorHint="@color/textcolor_black"

实际上我应该使用

                android:textColorHint="@color/textcolor_black"

作为 TextinputLayout 的一个属性

textcolor_black.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/black_txt" android:state_enabled="true" />
    <item android:color="@color/black_txt" android:state_selected="true" />
    <item android:color="@color/txtColorGray" android:state_selected="false" />
    <item android:color="@color/txtColorGray" android:state_enabled="false" />
</selector>
于 2020-10-05T06:55:25.433 回答