Search code examples
androidandroid-support-libraryandroid-textinputlayoutmaterial-componentsmaterial-components-android

OutlinedBox TextInputLayout and gravity center?


How to achieve centered new OutlinedBox style with TextInputLayout?

Current behavior:

left and center

<android.support.design.widget.TextInputLayout
    android:id="@+id/textInputLayout2"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="left"
    >
    <android.support.design.widget.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="left"
        android:hint="hint"
        />
</android.support.design.widget.TextInputLayout>

<android.support.design.widget.TextInputLayout
    android:id="@+id/textInputLayout"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    >
    <android.support.design.widget.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:hint="hint2"
        />
</android.support.design.widget.TextInputLayout>

I use com.android.support:design:28.0.0.

Any ideas to implement centered normal looking TextInputEditText?


Solution

  • With the Material Components Library, starting from the version 1.2.0-alpha02 the collapsed label position is determined via the edit text gravity.

    Using something like:

    <com.google.android.material.textfield.TextInputLayout
        android:hint="@string/...."
        ...>
    
        <com.google.android.material.textfield.TextInputEditText
            android:gravity="center"
            ../>
    
    </com.google.android.material.textfield.TextInputLayout>
    

    The result is:

    enter image description here