style - textinputlayout in android example

Cómo cambiar el color de la etiqueta flotante de TextInputLayout

Question

Con referencia al nuevo TextInputLayout lanzado por Google, ¿cómo cambio el color del texto de la etiqueta flotante?

Establecer colorControlNormal , colorControlActivated , colorControlHighLight en estilos no ayuda.

Esto es lo que tengo ahora:

Answer 1

Ahora, simplemente usando colorAccent y colorPrimary funcionará perfectamente.

Answer 2

En la última versión de la biblioteca de soporte (23.0.0+), TextInputLayout toma el siguiente atributo en XML para editar el color de la etiqueta flotante: android:textColorHint="@color/white"

Answer 3

En lugar de la respuesta de Brahmam Yamani, prefiero usar Widget.Design.TextInputLayout como padre. Eso garantiza que todos los elementos necesarios estén presentes, incluso si no todos los elementos se sobrescriben. En la respuesta de Yamanis, la aplicación se bloqueará con un recurso irresoluble, si se llama a setErrorEnabled (true).

Simplemente cambie el estilo a lo siguiente:

<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>

Answer 4

En mi caso, agregué esta " app:hintTextAppearance="@color/colorPrimaryDark" en mi widget TextInputLayout.

Answer 5

Encontró la respuesta, use el atributo android.support.design:hintTextAppearance para configurar su propia apariencia de etiqueta flotante.

Ejemplo:

<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>

Answer 6

Está funcionando para mí ... agregue color de pista en 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>

Answer 7

Intenté usar android: textColorHint en android.support.design.widget.TextInputLayout funciona bien.

 <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>

Answer 8

Le sugiero que cree un tema de estilo para TextInputLayout y cambie solo el color de acento. Establezca el padre en el tema base de su aplicación:

 <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">

Answer 9

No necesita usar android:theme="@style/TextInputLayoutTheme" para cambiar el color de la etiqueta flotante, ya que afectará a todo el tema para el pequeño TextView utilizado como etiqueta. En su lugar, puede usar la app:hintTextAppearance="@style/TextInputLayout.HintText" donde:

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

Avíseme si la solución funciona :-)

Answer 10

Ok, entonces, esta respuesta me pareció muy útil y gracias a todas las personas que contribuyeron. Sin embargo, solo para agregar algo. La respuesta aceptada es de hecho la respuesta correcta ... PERO ... en mi caso, estaba buscando implementar el mensaje de error debajo del widget EditText con la app:errorEnabled="true" y esta sola línea me hizo la vida difícil. parece que esto anula el tema que elegí para android.support.design.widget.TextInputLayout , que tiene un color de texto diferente definido por android:textColorPrimary .

Al final, decidí aplicar un color de texto directamente al widget EditText . Mi código se parece a esto:

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>

Y mi widget:

<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>

Ahora muestra el color del texto negro en lugar del textColorPrimary blanco.

Answer 11

Para cambiar el color de la pista y editar el color de subrayado del texto: colorControlActivated

Para cambiar el color del contador de caracteres: textColorSecondary

Para cambiar el color del mensaje de error: colorControlNormal

Para cambiar el tinte del botón de visibilidad de contraseña: colorForeground

Para obtener más información sobre TextInputLayout, lea 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>

Answer 12

Yo resuelvo el problema. Este es el diseño ：

 <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>

Este es el estilo:

<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>

Debe usar su tema en la aplicación:

<application
android:allowBackup="true"
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme" >
</application>

Answer 13

deberías cambiar tu color aquí

<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>

Answer 14

para cambiar el color de la etiqueta de texto cuando se está enfocando en ella. es decir, escribir en él. tienes que agregar especificar

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

Solo una nota: debe agregar todas estas implementaciones a su tema principal.

Answer 15

Pruebe el siguiente código: funciona en estado normal

 <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>

En la carpeta de estilos TextLabel Code

 <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>

Establecer como tema principal de la aplicación, solo funciona Resaltar estado solamente

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

Actualizar:

UnsupportedOperationException: no se puede convertir a color: tipo = 0x2 en la API 16 o inferior

Solution

Answer 16

 <style name="AppTheme2" parent="AppTheme">
<!-- Customize your theme here. -->
<item name="colorControlNormal">#fff</item>
<item name="colorControlActivated">#fff</item></style> 

agregue esto a los estilos y configure TextInputLayout Theam en App2 y funcionará;)

Answer 17

<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>

Answer 18

<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>