OutlinedBox for TextInputEditText – attribute android:style not found

Issue

Can not get working OutlinedBox for TextInputEditText. There is a similar question on Stackoverflow but none of solutions don’t work.

As soon as I add android:style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox" to the code, the form disappears from preview and when I try do build apk appears this error:

Android resource linking failed
com.my.app-main-50:/layout/fragment_login.xml:32: error: attribute android:style not found.
error: failed linking file resources.

Putting just style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"

does not work either

screenshot

build.gradle:

implementation 'com.google.android.material:material:1.7.0'

code:

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:background="#EAEAEA"
    tools:context=".LoginFragment">

    <androidx.appcompat.widget.AppCompatImageView
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:src="@drawable/logo_src"
        android:layout_alignParentStart="true"
        android:id="@+id/imageLogo"
        android:layout_alignParentTop="true"
        android:contentDescription="@string/t_logo"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="@string/app_description"
        android:id="@+id/appTitle"
        android:layout_below="@+id/imageLogo"
        android:layout_marginBottom="8dp"
        android:layout_centerHorizontal="true" />

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/editLoginWrapper"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/appTitle"
        android:hint="@string/login_hint"
        android:layout_marginTop="8dp"
        android:layout_marginBottom="8dp">
        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
            android:id="@+id/editLogin"
            android:inputType="text" />
    </com.google.android.material.textfield.TextInputLayout>

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/editPasswordWrapper"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/editLoginWrapper"
        android:layout_marginTop="8dp"
        android:layout_marginBottom="8dp"
        android:hint="@string/password_hint"
        app:endIconMode="password_toggle">
        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textPassword"
            android:id="@+id/editPassword" />
    </com.google.android.material.textfield.TextInputLayout>

    <androidx.appcompat.widget.AppCompatButton
        android:id="@+id/signIn"
        style="?attr/buttonStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/sign_in"
        android:layout_below="@+id/editPasswordWrapper"
        android:textSize="@dimen/button_text"
        android:textColor="@color/white"
        android:enabled="true"
        android:layout_centerHorizontal="true"
        app:backgroundTint="@color/button_background" />

    <Button
        android:id="@+id/forgotPassword"
        style="?attr/buttonBarButtonStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/signIn"
        android:layout_centerHorizontal="true"
        android:text="@string/forgot_password"
        android:textColor="#918B8B"
        android:textColorHighlight="#DC6C6C"
        android:textColorLink="#5E5E5E" />

</RelativeLayout>

Style inside of TextInputLayout:

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/editLoginWrapper"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/appTitle"
    android:hint="@string/login_hint"
    android:layout_marginTop="8dp"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    android:layout_marginBottom="8dp">

The app just crashes:

FATAL EXCEPTION: main
android.view.InflateException: Binary XML file line #41 in com.app.app:layout/fragment_login: Binary XML file line #41 in com.app.app:layout/fragment_login: Error inflating class com.google.android.material.textfield.TextInputLayout
Caused by: android.view.InflateException: Binary XML file line #41 in com.app.app:layout/fragment_login: Error inflating class com.google.android.material.textfield.TextInputLayout

Line 41 is:

style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"

Solution

Add the style in the TextInputLayout not TextInputEditText

style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"

and add the theme to the root layout and your activity theme should be MaterialComponents

android:theme="@style/Theme.MaterialComponents.Light"

Answered By – Moklesur Rahman

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published