问题
There appears to be left padding automatically added when using a TextInputLayout
to wrap an EditText
as you can see in the screenshot below.
There is no padding added to the EditText
in the layout XML, but when the view is rendered there appears to be left padding on the EditText
. You can see this when comparing the TextView
below the TextInputLayout
.
How do I disable this left padding from being added?
Thank you!
回答1:
TextInputLayout
is a LinearLayout
, so you should be able to specify a negative margin or padding, e.g.
android:layout_marginLeft="-2dp"
android:layout_marginStart="-2dp"
that will offset the space you're trying to eliminate.
The -2dp
value is just a guess; tune the value until it lines up the way you want.
回答2:
I managed to remove that left space by making a copy of the original theme of the edittext background
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>
in the two files delete:
android:insetLeft="@dimen/abc_edit_text_inset_horizontal_material" android:insetRight="@dimen/abc_edit_text_inset_horizontal_material"
Create a new style for your editText and add it as background
/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>
Add the style to your 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>
That is the way I found removing the left and right space.
I hope help, thanks
回答3:
You can just set the start and end padding on the inner EditText to 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>
Here's a screenshot with Show Layout Bounds turned on so you can see that the hints go all the way to the edge of the view.
回答4:
The horizontal space on the left and right of the EditText default drawable is controlled by the abc_edit_text_inset_horizontal_material
dimension. You can confirm that by looking at the abc_edit_text_material.xml
drawable file, which represents AppCompat's default EditText background. To remove the space completely you can just set the dimension to 0 by specifing the dimension with exact same name inside your own project's dimens.xml
file:
<?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>
However, there is a catch. AppCompat library will only use it's own abc_edit_text_material.xml
background if the host OS doesn't support material design. So If you're running your app on Android 4, you'll see that side margins disappear after you add the dimension mentioned above. If, however, you launch your app on say Android 10, you'll see that margins are still there. That is because on newer Android versions, compat library will actually prefer background drawable specified inside the OS itself.
So you need to force all of your EditTexts to use abc_edit_text_material.xml
background specified inside the AppCompat library. Luckily, you can do that just by adding one line to your syles.xml
file:
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>
Any Theme.AppCompat.*
will do as a parent theme and of course you have to use this theme as your app's theme in order to get any effect.
This solution uses private AppCompat identifiers (Android Studio will complain about this), but I still think this solution is much cleaner than using negative margins.
回答5:
With the TextInputLayout
included in the Material Components Library you can use a custom style to reduce the padding.
Just use something like:
<com.google.android.material.textfield.TextInputLayout
....
android:hint="Hint text"
style="@style/My.TextInputLayout.FilledBox.Padding" >
Then you can define a custom style for the EditText
using the materialThemeOverlay
attribute:
<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>
Here the final result:
Note: it requires the version 1.1.0 of the Material Components library.
来源:https://stackoverflow.com/questions/41403193/how-to-disable-padding-on-textinputlayout