Search code examples
androidxmlmaterial-designandroid-textinputlayoutmaterial-components-android

How do I reduce the padding between the text hint and text line?


I have a TextInputEditText with a hint shown. I really do not like the amount of space between the hint and text line. I have tried setting the gravity to bottom but no luck.

       <com.google.android.material.textfield.TextInputEditText
                    android:layout_width="400dp"
                    android:layout_height="wrap_content"
                    android:background="@android:color/white"
                    android:inputType="textNoSuggestions"
                    android:hint="@string/email_hint"
                    android:textColorHint="@color/color_hint_grey"
                    android:fontFamily="@font/alternate_got_no1d"
                    android:textSize="20sp"/>

enter image description here


Solution

  • In order to reduce the height of a text box, you can use a dense style, which will reduce the vertical padding within the text box

    <com.google.android.material.textfield.TextInputLayout
           ....
           android:hint="Hint text"       
           style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox.Dense" >
    

    Otherwise you can define (it requires the version 1.1.0) a custom style using:

      <style name="MyDense" parent="Widget.MaterialComponents.TextInputLayout.FilledBox.Dense">
        <item name="materialThemeOverlay">@style/MyThemeOverlayFilledDense</item>
      </style>
    
      <style name="MyThemeOverlayFilledDense">
        <item name="editTextStyle">@style/MyTextInputEditText_filledBox_dense</item>
      </style>
    
      <style name="MyTextInputEditText_filledBox_dense" parent="@style/Widget.MaterialComponents.TextInputEditText.FilledBox.Dense">
        <item name="android:paddingTop">24dp</item>
        <item name="android:paddingBottom">4dp</item>
      </style>
    

    Here the results (with a default style and the custom style):

    enter image description here enter image description here