如何同时做填充和大纲TextInputLayout android？答案

【问题标题】：How to do Filled and Outlined at the same time TextInputLayout android?如何同时做填充和大纲TextInputLayout android？
【发布时间】：2021-08-30 18:45:58
【问题描述】：

我使用了<com.google.android.material.textfield.TextInputLayout，但我也会接受其他选项或库

预期结果：

专注：
不专心：

【问题讨论】：

标签： android android-layout material-design android-custom-view material-components-android

【解决方案1】：

您可以使用继承自 Widget.MaterialComponents.TextInputLayout.FilledBox 的自定义 TextInputLayout 样式和 TextInputEditText 的自定义背景选择器来实现此目的。

在 xml 中创建 TextInputLayout，如下所示：

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/emailTextInputLayout"
    style="@style/MyTextInputLayoutStyle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginHorizontal="16dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <com.google.android.material.textfield.TextInputEditText
       android:id="@+id/emailTextInputEditText"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:background="@drawable/edit_text_background"
       android:hint="Email"
       android:importantForAutofill="no"
       android:singleLine="true" />
</com.google.android.material.textfield.TextInputLayout>

@style/MyTextInputLayoutStyle 是继承自 Widget.MaterialComponents.TextInputLayout.FilledBox 的自定义样式，如下所示：

<style name="MyTextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
   <item name="boxBackgroundColor">@android:color/transparent</item>
   <item name="boxStrokeWidth">0dp</item>
   <item name="boxStrokeWidthFocused">0dp</item>
   <item name="hintTextColor">#7d8b9f</item>
</style>

@drawable/edit_text_background 是一个 Drawable Selector，用于根据默认和聚焦状态更改背景，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true">
        <shape android:shape="rectangle">
            <solid android:color="#f0f5fa"/>
            <stroke android:width="2dp" android:color="#b5c3f6"/>
            <corners android:radius="10dp"/>
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#f0f5fa"/>
            <stroke android:width="0dp" android:color="#b5c3f6"/>
            <corners android:radius="10dp"/>
        </shape>
    </item>
</selector>

结果如下：

【讨论】：

【解决方案2】：

    <com.google.android.material.textfield.TextInputLayout
    android:id="@+id/email"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginHorizontal="16dp"
    <!--have your custom style/text appearance for hint and text input-->
    //android:theme="@style/TextInputLayoutStyle"
    //app:hintTextAppearance="@style/HintTextAppearance"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <com.google.android.material.textfield.TextInputEditText
      android:id="@+id/edEmail"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:hint="Email"
      android:importantForAutofill="no"
      android:singleLine="true" />
  </com.google.android.material.textfield.TextInputLayout>

【讨论】：

1.没想到：没有大纲