Textinputlayout :How to Give Padding or Margin to Hint

TextInputLayout :How to give padding or margin to hint?

The solution proposed by ganesh2shiv works for the most part, although I've found it also de-centres the hint text displayed inside the EditText when not focused.

A better trick is to set the desired paddingTop to the EditText but also embed the extra padding within the EditText's background. A fairly sane way to do this is to wrap your original background in a <layer-list> and set the <item android:top="..."> attribute to match the paddingTop of your EditText.

<android.support.design.widget.TextInputLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content">

  <EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="@dimen/floating_hint_margin"
    android:background="@drawable/bg_edit_text" />
</android.support.design.widget.TextInputLayout>

And the bg_edit_text.xml drawable file:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:top="@dimen/floating_hint_margin">
    <your original background; can be <bitmap> or <shape> or whatever./>
  </item>
</layer-list>

Remove extra space/padding/margin while using TextInputLayout and TextInputEditText

make styles for editText in which you remove padding

 <style name="styleTextInputEditText" parent="Base.Widget.MaterialComponents.TextInputEditText">
    <item name="android:paddingStart">0dp</item>
    <item name="android:paddingEnd">0dp</item>
    <item name="android:paddingTop">0dp</item>
    <item name="android:paddingBottom">0dp</item>
    .....
</style>

and assign it to your textInputLayout editText

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/yourId"
    style="@style/styleTextInput"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    ....>

    <com.google.android.material.textfield.TextInputEditText
        style="@style/styleTextInputEditText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        .... />
</com.google.android.material.textfield.TextInputLayout>

How to disable padding on TextInputLayout?

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.

Removing TextInputLayout extra top padding

You can remove extra space above AppCompatEditText by setting app:hintEnabled="false" to TextInputLayout but it won't display hint until you re-enable that.

For more info goto Android Developer site -TextInputLayout

Checkout below code

<android.support.design.widget.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:hintEnabled="false">

    <android.support.v7.widget.AppCompatEditText
        android:id="@+id/txt_amount"
        style="@style/EditTextStyle"
        android:hint="@string/hint_amount"
        android:inputType="numberDecimal"/>
</android.support.design.widget.TextInputLayout>

Hope this helpfull..

@Rajesh

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

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):

Gap between Edittext underline and Hint in Input Layout

Try with below code : Use android:padding="any value in sp/dp" for between your bottom line and editText.

 <android.support.design.widget.TextInputLayout
    android:id="@+id/TextInputLayout1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="16dp"
    android:layout_marginTop="8dp"
    android:clipChildren="false">

    <android.support.design.widget.TextInputEditText
        android:id="@+id/password_et"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="3dp"
        android:hint="Password"
        android:padding="5dp"
        android:translationY="3dp" />
</android.support.design.widget.TextInputLayout>

---

Related Topics