CODEWITHSUNDEEP
androidandroid-edittextandroid-textinputlayoutmaterial-componentsmaterial-components-android
giozh
giozh

Reputation: 10068

EditText inside TextInputLayout doesn't get proper style

In my layout i have classic username/password form fields with show password toggle:

<EditText
        style="@style/editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Email"
        android:imeOptions="actionNext"
        android:inputType="textEmailAddress"
        android:maxLines="1" />


    <com.google.android.material.textfield.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:passwordToggleEnabled="true">

        <EditText
            style="@style/editText"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Password"
            android:imeOptions="actionDone"
            android:inputType="textPassword"
            android:maxLines="1" />

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

and style/editText is

 <style name="editText" parent="Widget.AppCompat.EditText">
    <item name="android:paddingLeft">@dimen/dp10</item>
    <item name="android:background">@color/white</item>
    <item name="android:textSize">@dimen/sp16</item>
    <item name="android:fontFamily">@font/rbt_bold</item>
    <item name="android:textStyle">bold</item>
</style>

and font/rbt_bold is

<?xml version="1.0" encoding="utf-8"?>
<font-family xmlns:android="http://schemas.android.com/apk/res/android">
    <font
        android:font="@font/roboto_bold"
        android:fontStyle="normal" />
</font-family>

Now it seems that password edittext doen't get correct style:

https://i.sstatic.net/LCKOB.png

what's wrong?

Upvotes: 0

Views: 618

Answers (1)

Gabriele Mariotti
Gabriele Mariotti

Reputation: 363677

Use:

<com.google.android.material.textfield.TextInputLayout
      app:endIconMode="password_toggle"
      android:hint="Password"
      app:endIconTint="@color/text_input_passwordtoggle_selector_color"
      style="@style/CustomTIL"
      ..>

            <com.google.android.material.textfield.TextInputEditText
                android:inputType="textPassword"
                .../>

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

With a custom style:

  <style name="CustomTIL" parent="Widget.MaterialComponents.TextInputLayout.FilledBox" >
    <item name="materialThemeOverlay">@style/CustomThemeOverlay_FilledBox</item>
  </style>

  <style name="CustomThemeOverlay_FilledBox">
    <item name="editTextStyle">@style/CustomTextInputEditText_FilledBox</item>
  </style>

  <style name="CustomTextInputEditText_FilledBox" parent="Widget.MaterialComponents.TextInputEditText.FilledBox">
     <item name="android:textAppearance">...yourTextAppearance...</item>
  </style>

Upvotes: 1

Related Questions