如何使用 OutlinedBox 样式从 TextInputLayout 中删除浮动标签？

Question

TextInputLayout 处于聚焦模式时，有没有办法移除浮动标签（提示）？

当我尝试设置 app:hintEnabled="false" 并在 TextInputeEditText 内提示时，TextInputLayout 通过隐藏顶部笔划而表现得很奇怪。

<com.google.android.material.textfield.TextInputLayout
      style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:hint="Text">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

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

重要的是我在1.1.0-alpha01. 版本中使用了材质组件

编辑

这是它的样子（当输入没有聚焦时）：

顶部笔划被剪切。

Answer 1

是的，有一种相当简单的方法可以删除浮动标签提示，并且只在您的 TextInputLayout 中提供提示。

这可以通过禁用TextInputLayout 中的提示轻松实现，并将提示设置在TextInputEditText 而不是TextInputLayout 上，如下所示：

<com.google.android.material.textfield.TextInputLayout
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:hintEnabled="false">

    <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="hint text comes here" />

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

结果如下所示：

当添加一些文本时，它会如下所示：

我在 Material Components v1.2.0 中尝试过这个

Answer 2

只需为EditText 设置提示以编程方式 并从您的TextInputLayout 中删除app:hintEnabled="false"，如果你有，在我的情况下工作:)

Answer 3

你应该首先使用这种风格：

<style name="TextInputLayoutOutlinedBoxStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="android:textColorHint">#F5F5F5</item>
    <item name="hintTextAppearance">@style/HintTextAppearance</item>
    <item name="boxCornerRadiusBottomEnd">20dp</item>
    <item name="boxCornerRadiusBottomStart">20dp</item>
    <item name="boxCornerRadiusTopEnd">20dp</item>
    <item name="boxCornerRadiusTopStart">20dp</item>
</style>

你应该有这样的 textinputlayout 包含这种风格：

  <com.google.android.material.textfield.TextInputLayout
        style="@style/TextInputLayoutOutlinedBoxStyle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/relativelayout_activatetoken_main"
        android:layout_marginStart="20dp"
        android:layout_marginTop="30dp"
        android:layout_marginEnd="20dp"
        android:hint="@string/activatetoken_passwordhint"
        android:textColorHint="@color/colorText"
        app:helperText="@string/activatetoken_passwordhelpertext"
        app:helperTextTextAppearance="@style/TextAppearanceHelper"
        app:hintTextAppearance="@style/TextAppearanceBase"
        app:passwordToggleTint="@color/text_50">

对于边框颜色，请使用以下颜色：

 <color name="mtrl_textinput_default_box_stroke_color" tools:override="true">#F5F5F5</color>

Answer 4

尝试将提示设置为空文本布局和编辑文本：-

<com.google.android.material.textfield.TextInputLayout
      app:boxBackgroundMode="outline"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:hint="">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:hint=""
            android:layout_height="wrap_content" />

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

如果你想使用提示，那么你可以使用自定义drawable作为EditText的背景：-

<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <corners android:radius="10dp"/>
    <solid android:color="#ffffff"/>
    <stroke android:color="#000000"
    android:width="2dp"/>

</shape>