TextInputLayout样式 [英] TextInputLayout styling

问题描述

我的自定义 TextInputLayout 出现问题.这是我的代码

 < com.google.android.material.textfield.TextInputLayoutandroid:id ="@ + id/phone"android:layout_width ="0dp"android:layout_height ="wrap_content"android:theme ="@ style/CustomTextInputLayout"android:hint ="@ string/phone_number"android:layout_marginTop ="8dp"android:layout_marginStart ="16dp"android:layout_marginEnd ="16dp"app:startIconDrawable ="@ drawable/account"android:background ="@ color/bg_light_gray"app:layout_constraintLeft_toLeftOf ="parent"app:layout_constraintRight_toRightOf ="parent"app:layout_constraintTop_toBottomOf ="@ + id/page_description">< com.google.android.material.textfield.TextInputEditTextandroid:layout_width ="match_parent"android:layout_height =?attr/listPreferredItemHeight"android:background ="@ color/bg_light_gray"android:inputType ="phone"android:singleLine ="true"/></com.google.android.material.textfield.TextInputLayout> 

这是我来自 style.xml 文件的代码

 <样式名称="CustomTextInputLayout" parent ="Widget.Design.TextInputLayout">< item name ="errorTextAppearance"> @ style/ErrorText</item>< item name ="colorControlNormal"> @ color/green_txt</item>< item name ="colorControlActivated"> @ color/orange</item>< item name ="colorControlHighlight"> @ color/orange</item></style> 

我想将 TextInputLayout 的基准颜色设置为橙色，但现在是灰色.另外，我放置了一个图标，其原始颜色为橙色，但是放置后变为深灰色.现在，我不了解为什么会发生这种情况以及如何解决此问题.有人可以帮我吗?

解决方案

我想将TextInputLayout的基线颜色设置为橙色

只需使用

我还放置了一个图标，其原始颜色为橙色，但是放置后变为深灰色.

使用 app:endIconTint 属性将颜色或颜色选择器应用于结束图标.

 < com.google.android.material.textfield.TextInputLayoutandroid:id ="@ + id/custom_end_icon"android:hint =提示文字"style ="@ style/Widget.MaterialComponents.TextInputLayout.FilledBox"app:boxStrokeColor ="@ color/text_input_selector"app:endIconMode ="custom"app:endIconDrawable ="@ drawable/ic_add_24px"app:endIconTint ="@ color/text_input_selector" 

I have problem with my custom TextInputLayout. Here is my code

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/phone"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:theme="@style/CustomTextInputLayout"
    android:hint="@string/phone_number"
    android:layout_marginTop="8dp"
    android:layout_marginStart="16dp"
    android:layout_marginEnd="16dp"
    app:startIconDrawable="@drawable/account"
    android:background="@color/bg_light_gray"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/page_description">

    <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="?attr/listPreferredItemHeight"
        android:background="@color/bg_light_gray"
        android:inputType="phone"
        android:singleLine="true" />
</com.google.android.material.textfield.TextInputLayout>

Here is my code from style.xml file

<style name="CustomTextInputLayout" parent="Widget.Design.TextInputLayout">
    <item name="errorTextAppearance">@style/ErrorText</item>
    <item name="colorControlNormal">@color/green_txt</item>
    <item name="colorControlActivated">@color/orange</item>
    <item name="colorControlHighlight">@color/orange</item>
</style>

I want to make a baseline color of TextInputLayout to orange, but now it is gray. Also, I place an icon, which has its original color orange, but after placing it became dark gray. Now I am not understanding why it is happening and how to fix this problem. Can someone help me with that?

解决方案

I want to make base line color of TextInputLayout to orange

Just use a Material theme (for example Widget.MaterialComponents.TextInputLayout.FilledBox) the app:boxStrokeColor attribute to change the color.

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/custom_end_icon"
    style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox"
    app:boxStrokeColor="@color/text_input_selector

where the selector is something like:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:color="?attr/colorPrimary" android:state_focused="true"/>
  <item android:alpha="0.87" android:color="?attr/colorOnSurface" android:state_hovered="true"/>
  <item android:alpha="0.12" android:color="?attr/colorOnSurface" android:state_enabled="false"/>
  <item android:alpha="0.38" android:color="?attr/colorAccent"/>
</selector>

Also I place an icon, which has its original color orange, but after placing it became dark gray.

Use the app:endIconTint attribute to apply a color or a color selector to your end icon.

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/custom_end_icon"
    android:hint="Hint text"
    style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox"
    app:boxStrokeColor="@color/text_input_selector"
    app:endIconMode="custom"
    app:endIconDrawable="@drawable/ic_add_24px"
    app:endIconTint="@color/text_input_selector"

这篇关于TextInputLayout样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！