Search code examples
androidmaterial-designthemesandroid-themeandroid-textinputlayout

My app crashes when i use style in textfield.TextInputLayout


I want to add a style to my textfield.TextInputLayout, but when I add the app crashes and get error(This component requires that you specify a valid TextAppearance attribute. Update your app theme to inherit from Theme.MaterialComponents (or a descendant)) My theme inherits MaterialComponents, and I use the last version of dependencies. implementation 'com.google.android.material:material:1.9.0-alpha01' I use the following code in my app

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/textInputLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginStart="16dp"
    android:layout_marginTop="8dp"
    android:layout_marginEnd="16dp"
    app:helperText="required"
    app:helperTextTextColor="@color/Red"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView2"
    style="@style/Widget.Material3.TextInputLayout.OutlinedBox.ExposedDropdownMenu">

    <AutoCompleteTextView
        android:id="@+id/from_auto_complete_tV"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:inputType="none"
        android:text="Dollar" />

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

And this my theme:

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.CurrencyConverter" parent="Theme.MaterialComponents.Light.NoActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/purple_500</item>
        <item name="colorPrimaryVariant">@color/purple_700</item>
        <item name="colorOnPrimary">@color/white</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor">?attr/colorPrimaryVariant</item>
        <!-- Customize your theme here. -->
    </style>

</resources>

I searched a lot and tried many solutions, such as updating the dependencies or making the theme inherit from MaterialComponents.


Solution

  • You have styles from different libraries on the app theme and the TextInputLayout

    • App theme uses material components
    • TextInputLayout uses Material 3 style with parent="Theme.MaterialComponents.Light.NoActionBar" style="@style/Widget.Material3.TextInputLayout.OutlinedBox.ExposedDropdownMenu"

    This will cause inflation exception

    You need to change either one to be matched with the other. So either:

    • To have Material 3, change the app theme to inherit from "Theme.Material3.DayNight.NoActionBar"

    • Or to use material components, change the TextInputLayout style to "@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu"