如何禁用 TextInputLayout 上的填充?

How to disable padding on TextInputLayout?

当使用 TextInputLayout 包裹 EditText 时,似乎会自动添加左侧填充,如下面的屏幕截图所示。

布局 XML 中的 EditText 没有添加填充,但是在呈现视图时 EditText 上似乎有左侧填充。在比较 TextInputLayout.

下面的 TextView 时,您可以看到这一点

如何禁止添加此左填充?

谢谢!

我通过复制 edittext 背景的原始主题

设法删除了剩下的 space

res/drawable/my_edit_text_material.xml

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
   android:insetLeft="@dimen/abc_edit_text_inset_horizontal_material"
   android:insetRight="@dimen/abc_edit_text_inset_horizontal_material"
   android:insetTop="@dimen/abc_edit_text_inset_top_material"
   android:insetBottom="@dimen/abc_edit_text_inset_bottom_material">

<selector>
    <item android:state_enabled="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
    <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
    <item android:drawable="@drawable/abc_textfield_activated_mtrl_alpha"/>
</selector>

</inset>

res/drawable-v21/my_edit_text_material.xml

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
android:insetTop="@dimen/abc_edit_text_inset_top_material"
android:insetBottom="@dimen/abc_edit_text_inset_bottom_material">
<selector>
    <item android:state_enabled="false">
        <nine-patch android:src="@drawable/abc_textfield_default_mtrl_alpha"
            android:tint="?attr/colorControlNormal"
            android:alpha="?android:attr/disabledAlpha"/>
    </item>
    <item android:state_pressed="false" android:state_focused="false">
        <nine-patch android:src="@drawable/abc_textfield_default_mtrl_alpha"
            android:tint="?attr/colorControlNormal"/>
    </item>
    <item>
        <nine-patch android:src="@drawable/abc_textfield_activated_mtrl_alpha"
            android:tint="?attr/colorControlActivated"/>
    </item>
</selector>
</inset>

在两个文件中删除:

android:insetLeft="@dimen/abc_edit_text_inset_horizontal_material" android:insetRight="@dimen/abc_edit_text_inset_horizontal_material"


为您的 editText 创建新样式并将其添加为背景

/res/values/styles.xml

<resources>

<!-- Other styles . -->

<style name="AppTheme.EditText" parent="Widget.AppCompat.EditText">
    <item name="android:background">@drawable/my_edit_text_material</item>
</style>
</resources>

将样式添加到您的 editText

<android.support.design.widget.TextInputLayout
    android:id="@+id/input_layout_lastname"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="16dp"
    android:layout_marginLeft="0dp"
    android:layout_marginStart="0dp"
    android:textColorHint="@color/Cool_Gray_2_C"
    app:layout_constraintEnd_toStartOf="@+id/profile_guideline_end"
    app:layout_constraintStart_toStartOf="@+id/profile_guideline_start"
    app:layout_constraintTop_toBottomOf="@+id/input_layout_firstname" >

    <EditText
        style="@style/AppTheme.EditText"
        android:id="@+id/txfLastname"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:hint="@string/last_name"
        android:inputType="textPersonName"
        android:textColor="@color/Cool_Gray_2_C"
        android:textColorHint="@color/Cool_Gray_2_C"
        android:textSize="17sp" />

</android.support.design.widget.TextInputLayout>

这就是我发现删除左右的方法space。

希望能帮到你,谢谢

您可以将内部 EditText 的开始和结束填充设置为 0dp。

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

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

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

这是一张启用了 Show Layout Bounds 的屏幕截图,因此您可以看到提示一直延伸到视图的边缘。

EditText默认drawable左右水平space由abc_edit_text_inset_horizontal_material维度控制。您可以通过查看 abc_edit_text_material.xml 可绘制文件来确认这一点,该文件代表 AppCompat 的默认 EditText 背景。要完全删除 space,您可以通过在您自己项目的 dimens.xml 文件中指定具有完全相同名称的维度来将维度设置为 0:

<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:tools="http://schemas.android.com/tools">
    <dimen tools:override="true" name="abc_edit_text_inset_horizontal_material">0dp</dimen>
    ...
</resources>

但是,有一个问题。如果主机 OS 不支持 material 设计,AppCompat 库将仅使用它自己的 abc_edit_text_material.xml 背景。因此,如果您 运行 您的应用在 Android 4 上,您会看到在添加上述尺寸后侧边距消失了。但是,如果您在 Android 10 上启动您的应用程序,您会看到边距仍然存在。这是因为在较新的 Android 版本中,compat 库实际上更喜欢在 OS 本身中指定的背景可绘制对象。

因此您需要强制所有 EditText 使用 AppCompat 库中指定的 abc_edit_text_material.xml 背景。幸运的是,您只需在 syles.xml 文件中添加一行即可做到这一点:

styles.xml:
<resources xmlns:tools="http://schemas.android.com/tools">
    <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
        <item name="editTextBackground">@drawable/abc_edit_text_material</item>
        ...
    </style>
    ...
</resources>

任何 Theme.AppCompat.* 都可以作为父主题,当然您必须使用此主题作为您应用的主题才能获得任何效果。

此解决方案使用私有 AppCompat 标识符(Android Studio 会抱怨这一点),但我仍然认为此解决方案比使用负边距要干净得多。

随着 TextInputLayout 包含在 Material Components Library 中,您可以使用自定义样式来减少填充。

只需使用类似的东西:

<com.google.android.material.textfield.TextInputLayout
       ....
       android:hint="Hint text"       
       style="@style/My.TextInputLayout.FilledBox.Padding" >

然后您可以使用 materialThemeOverlay 属性为 EditText 定义自定义样式:

  <style name="My.TextInputLayout.FilledBox.Padding" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
    <item name="materialThemeOverlay">@style/MyThemeOverlayFilledPadding</item>
  </style>

  <style name="MyThemeOverlayFilledPadding">
    <item name="editTextStyle">@style/MyTextInputEditText_filledBox_padding</item>
  </style>

  <style name="MyTextInputEditText_filledBox_padding" parent="@style/Widget.MaterialComponents.TextInputEditText.FilledBox">
    <!-- left and right padding -->
    <item name="android:paddingStart" ns2:ignore="NewApi">2dp</item>
    <item name="android:paddingEnd" ns2:ignore="NewApi">2dp</item>
    <item name="android:paddingLeft">2dp</item>
    <item name="android:paddingRight">2dp</item>
    
    <!-- top and bottom padding -->
    <item name="android:paddingTop">28dp</item>
    <item name="android:paddingBottom">12dp</item>
  </style>

这里是最终结果:

注意: 它至少需要 Material 组件库的 1.1.0 版本。

像这样使内边距为 0dp

<com.google.android.material.textfield.TextInputLayout
    style="@style/UserTextLayout"
    android:layout_height="50dp"
    app:boxBackgroundMode="none">

    <com.google.android.material.textfield.TextInputEditText
        android:id="@+id/emailEditText1"
        style="@style/UserEditText"
        android:layout_width="match_parent"
        android:hint="MATRIC NUMBER"
        android:inputType="number"
        android:maxLines="1"
        android:padding="0dp"
        android:text="20181766" />
</com.google.android.material.textfield.TextInputLayout>

这是结果

   <com.google.android.material.textfield.TextInputLayout
            android:id="@+id/textField_driver_age"
            style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox.ExposedDropdownMenu"
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:padding="0dp"
            android:textColorHint="@color/brown_grey"
            app:boxBackgroundColor="@color/white"
            app:boxStrokeWidth="0dp"
            app:boxStrokeWidthFocused="0dp"
            app:endIconMode="none"
            app:layout_constraintBottom_toBottomOf="@+id/lable3"
            app:layout_constraintStart_toEndOf="@+id/lable3"
            app:layout_constraintTop_toTopOf="@+id/lable3">

            <AutoCompleteTextView
                android:drawablePadding="8dp"
                android:drawableEnd="@drawable/ic_email"
                android:id="@+id/et_driver_age"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:dropDownHeight="250dp"
                android:inputType="none"
                android:lines="1"
                android:padding="0dp"
                android:text="30"
                android:textColor="@color/greyish_brown"
                android:textSize="12sp" />