下のスクリーンショットにあるように、TextInputLayout
を使用してEditText
をラップすると、自動的に左のパディングが追加されるようです。
レイアウトXMLのEditText
にはパディングが追加されていませんが、ビューがレンダリングされると、EditText
に左パディングが残っているように見えます。これは、TextView
の下のTextInputLayout
を比較するとわかります。
この左パディングが追加されないようにするにはどうすればよいですか?
ありがとうございました!
TextInputLayout
はLinearLayout
なので、負のマージンやパディングを指定できるはずです。
Android:layout_marginLeft="-2dp"
Android:layout_marginStart="-2dp"
それはあなたが排除しようとしているスペースを相殺します。
-2dp
値は単なる推測です。希望どおりに並ぶまで値を調整します。
内部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の背景の元のテーマのコピーを作成して、残ったスペースをなんとか削除しました
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>
2つのファイルで削除:
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>
これが、左と右のスペースを削除する方法です。
助けてくれてありがとう
Material Components Library に含まれるTextInputLayout
を使用すると、カスタムスタイルを使用してパディングを減らすことができます。
次のようなものを使用してください:
<com.google.Android.material.textfield.TextInputLayout
....
Android:hint="Hint text"
style="@style/My.TextInputLayout.FilledBox.Padding" >
次に、EditText
属性を使用してmaterialThemeOverlay
のカスタムスタイルを定義できます。
<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 Components Libraryのバージョン1.1.0が必要です。
EditTextデフォルトドローアブルの左右の水平方向のスペースは、abc_edit_text_inset_horizontal_material
ディメンションによって制御されます。これは、AppCompatのデフォルトのEditText背景を表すabc_edit_text_material.xml
ドローアブルファイルを確認することで確認できます。スペースを完全に削除するには、独自のプロジェクトの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>
ただし、落とし穴があります。 AppCompatライブラリは、ホストOSがマテリアルデザインをサポートしていない場合にのみ、独自のabc_edit_text_material.xml
バックグラウンドを使用します。したがって、Android 4でアプリを実行している場合は、上記のディメンションを追加すると、サイドマージンが消えることがわかります。ただし、たとえばAndroid 10でアプリを起動すると、余白が残っていることがわかります。新しいAndroidバージョンでは、compatライブラリは実際にはOS自体の内部で指定されたバックグラウンドドローアブルを優先するためです。
そのため、AppCompatライブラリ内で指定されたabc_edit_text_material.xml
バックグラウンドを使用するようにすべてのEditTextを強制する必要があります。幸いにも、syles.xml
ファイルに1行追加するだけでそれを行うことができます。
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はこれについて不満を言うでしょう)が、このソリューションは負のマージンを使用するよりもずっとクリーンだと思います。
このようにパディングを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>
これが結果です