从 TextInputEditText 中删除下划线

问题描述 投票:0回答:16

我有一个 Android 屏幕,可以接收用户的电子邮件。下面是代码片段,我想删除文本下方出现的下划线。

<com.google.android.material.textfield.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:hint="@string/email"
    android:textColorHint="@color/blueBackground"
    app:boxBackgroundColor="@color/input_background"
    app:boxCornerRadiusBottomEnd="20dp"
    app:boxCornerRadiusBottomStart="20dp"
    app:boxCornerRadiusTopEnd="20dp"
    app:boxCornerRadiusTopStart="20dp"
    app:endIconMode="clear_text"
    app:endIconTint="@color/blueBackground"
    app:hintTextColor="@color/blueBackground">

    <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@color/blueBackground"
        android:textSize="18sp"
        android:layout_margin="8dp" />

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

我已经尝试过

android:background="@null"

<item name="colorControlNormal">@android:color/transparent</item>
<item name="colorControlActivated">@android:color/transparent</item>

但是它不起作用。

EditText

android android-textinputlayout android-textinputedittext
16个回答
102
投票

如果您想使用填充框,那么下面的代码非常适合我。

app:boxStrokeWidth="0dp"
app:boxStrokeWidthFocused="0dp"

在输入布局中添加以上行。


25
投票

app:boxBackgroundMode="none"
在父级
TextInputLayout


24
投票

2022 更新

我的答案已被标记为所描述问题的解决方案,但看起来它已经过时了,并且有更好的方法。请参阅Gunavant Patel 的回答以获取最新修复。



原答案

看起来材质组件库使用

app:boxStrokeColor
绘制自己的下划线。该属性是一个
ColorStateList
,因此您必须创建一个颜色状态列表资源,其中所有状态的颜色都设置为透明。所以基本上你想创建一个新文件
res/color/filename.xml
:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:color="@android:color/transparent"
        android:state_pressed="true"
        android:state_focused="true"
        android:state_selected="true"
        android:state_checkable="true"
        android:state_checked="true"
        android:state_enabled="true"
        android:state_window_focused="true" />
</selector>

并将

app:boxStrokeColor
属性设置为
@color/filename

但是,这给我留下了一条黑色下划线,它仍然无法响应

android:background=@null
<item name="colorControl*">@android:color/transparent</item>


TL;博士

快速修复:如果使用

TextInputLayout
设置
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
轮廓,框看起来几乎相同,但下划线消失了。要删除笔划,只需将
app:boxStrokeColor
属性设置为
@null


19
投票
<style name="Theme.MyApp" parent="Theme.MaterialComponents.Light.NoActionBar">
    <item name="textInputStyle">@style/Widget.MyApp.TextInputLayout</item>
</style>

<style name="Widget.MyApp.TextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
    <item name="boxStrokeWidth">0dp</item>
    <item name="boxStrokeWidthFocused">0dp</item>
</style>

11
投票

请在TextInputLayout中设置boxBackgroundMode。这是在 TextInputLayout 中删除下划线的简单而正确的方法

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

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

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

9
投票

将 TextInputLayout 的背景设置为可绘制并将 TextInputEditText 的背景设置为透明会删除下划线:

<com.google.android.material.textfield.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="8dp"
        android:hint="@string/email"
        android:background="@drawable/blue_drawable"
        app:endIconMode="clear_text"
        app:endIconTint="@color/black"
        app:hintTextColor="@color/black">

    <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColor="@color/black"
            android:background="@android:color/transparent"
            android:textSize="18sp"
            android:layout_margin="8dp" />

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

blue_drawable.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
<corners android:radius="20dp"/>
<solid android:color="@android:color/holo_blue_bright"/></shape>

enter image description here


9
投票

你只需要写 app:boxStrokeWidth="0dp"app:boxStrokeWidthFocused="0dp" TextInputLayout 组件的属性。

应该这样写:

<com.google.android.material.textfield.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    app:boxStrokeWidth="0dp"
    app:boxStrokeWidthFocused="0dp"
    android:hint="@string/email"
    android:textColorHint="@color/blueBackground"
    app:boxBackgroundColor="@color/input_background"
    app:boxCornerRadiusBottomEnd="20dp"
    app:boxCornerRadiusBottomStart="20dp"
    app:boxCornerRadiusTopEnd="20dp"
    app:boxCornerRadiusTopStart="20dp"
    app:endIconMode="clear_text"
    app:endIconTint="@color/blueBackground"
    app:hintTextColor="@color/blueBackground">

<com.google.android.material.textfield.TextInputEditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textColor="@color/blueBackground"
    android:textSize="18sp"
    android:layout_margin="8dp" />

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

8
投票

如果你想要 app:boxBackgroundMode 填充且没有下划线,那么这将起作用

<item name="boxStrokeWidthFocused">0dp</item>
<item name="boxStrokeWidth">0dp</item>

6
投票

TextInputLayout
上添加这一行对我有用:

app:boxStrokeWidth="0dp"

更新

在 color res 目录中添加 et_box_color.xml 文件并在其中添加以下行:

<selector xmlns:android="http://schemas.android.com/apk/res/android" >
   <item android:color="@color/transparent"
        android:state_pressed="true"
        android:state_focused="true"
        android:state_selected="true"
        android:state_checkable="true"
        android:state_checked="true"
        android:state_enabled="true"
        android:state_window_focused="true"/>
</selector>

现在添加您的材质编辑文本,如下所示:

<com.google.android.material.textfield.TextInputLayout
                android:id="@+id/textInputLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/border"
                app:boxStrokeColor="@color/et_box_color"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/llBank">

                <com.google.android.material.textfield.TextInputEditText
                    android:id="@+id/etAmount"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="1dp"
                    android:background="#00FFFFFF"
                    android:gravity="center"
                    android:hint="Amount"
                    android:imeOptions="actionDone"
                    android:inputType="numberDecimal" />

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

我添加了一个背景来制作 TextInputLayout 的边框,如果不需要,请删除 TextInputLayout 的背景。要使背景透明,需要 TextInputEditText 的背景。


6
投票

解决方案很简单,你只需将这一行添加到

TextInputLayout
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
它将被修复。


3
投票

简单的方法;

app:boxBackgroundMode="filled"
app:boxStrokeWidth="0dp"

1
投票

res/drawable

创建一个选择器
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="0.01" android:color="?attr/background" android:state_focused="true"/>
    <item android:alpha="0.01" android:color="?attr/background" android:state_hovered="true"/>
    <item android:alpha="0.01" android:color="?attr/background" android:state_enabled="false"/>
    <item android:alpha="0.01" android:color="?attr/background"/>
</selector>

背景在这里 - 任何接近您背景的颜色。

方式1 然后将其设置为您的

TextInputLayout

<com.google.android.material.textfield.TextInputLayout
...
  app:boxStrokeColor="@drawable/text_input_selector"
...

方式2,槽式:

styles.xml

<style name="vm_textFilledBox" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
        <item name="boxStrokeColor">@drawable/text_input_selector</item>
</style>
 <com.google.android.material.textfield.TextInputLayout
...
    style="@style/vm_textFilledBox"

0
投票

像这样制作你的自定义 TextInputLayout

package com.google.android.material.textfield

import android.content.Context
import android.util.AttributeSet
class TextInputLayoutWithoutUnderline @JvmOverloads constructor(
        context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
) : TextInputLayout(context, attrs, defStyleAttr) {

    override fun updateEditTextBackground() {
        // XXX don't call super on purpose
    }

}

0
投票

注意:这个答案是关于在输入时删除下划线的

TextInputEditText

在搜索了 6 个小时关于如何从

TextInputEditText
中删除下划线之后,我找到了一个单行解决方案,只需将
android:inputType="text|textNoSuggestions"
放入你的
TextInputEditText
中即可。

现在我在输入时没有任何下划线

TextInputEditText


0
投票
 android:backgroundTint="#FFFFFF" in TextInputEditText

-1
投票

尝试将背景设置为

@null
@android:color/transparent

© www.soinside.com 2019 - 2024. All rights reserved.