How to change hint padding for TextInputLayout when using the new prefixText?

Question

I have tried implementing TextInputLayout with the new prefixText, using com.google.android.material:material:1.2.0-alpha02. This is a very cool feature, but when I add a prefix text the hint label floats up and aligns after the prefix. This does not look good, especially if you have more input fields on the same page without prefix, the floating labels does not align.

Relevant parts of my layout code:

 <LinearLayout
       android:id="@+id/login_input_fields"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:orientation="vertical">

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/login_username_input"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/username_hint"
        app:prefixText="Prefix">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/login_username_edit_text"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="number"
            android:singleLine="true" />
    </com.google.android.material.textfield.TextInputLayout>

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/login_password_input"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/default_margin"
        android:imeOptions="actionDone"
        app:endIconMode="password_toggle">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/password_hint"
            android:inputType="textPassword"
            android:singleLine="true"/>

    </com.google.android.material.textfield.TextInputLayout>
</LinearLayout>

Answer 1

To use the Material Components Library you have to use a Theme.MaterialComponents.* theme.

Using your layout with this theme:

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
 ...
</style>

Using your layout with this theme:

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
  ...
</style>

Answer 2

 val prefixView = textInputLayout.findViewById<AppCompatTextView>(com.google.android.material.R.id.textinput_prefix_text)
  prefixView.layoutParams = LinearLayout.LayoutParams(
      ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.MATCH_PARENT)
  prefixView.gravity = Gravity.CENTER

you may find more details here https://github.com/material-components/material-components-android/issues/773 if you wish to light prefix with input text