Setting up a Material Components theme for your Android Application

Recently we migrated one of our old application to Androidx and then we came across this Material components which we can use for our app. This posts details only changes required to migrate your app from AppCompat theme to Material Design theme. Other details of Material components can be seen on its website.

Modify app/build.gradle to add material library dependency as,

dependencies {
    implementation 'com.google.android.material:material:1.4.0-alpha01'
}

Create a new theme in app/src/main/res/values/styles.xml

<style name="MaterialAppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

If you are porting an old AppTheme, then you can change below code from,

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

to

<style name="MaterialAppTheme" parent="Theme.MaterialComponents.DayNight">

Modify your app/src/main/AndroidManifest.xml and modify your all the activities for which you want to use material theme using “android:theme” as below,

 <activity
     android:name="com.myapp.MainActivity"
     android:label="@string/app_name"
     android:screenOrientation="portrait"
     android:theme="@style/MaterialAppTheme"
     android:windowSoftInputMode="stateHidden|adjustResize" />

Now, you are all set to use the material theme. Just compile and try on your Mobile.

Possible Errors

  1. If you get an errors like “AndroidRuntime: Caused by: android.view.InflateException: Binary XML file line” “Error inflating class com.google.android.material.textfield.TextInputLayout” as shown below at the run time while opening your application,
AndroidRuntime: FATAL EXCEPTION: main
AndroidRuntime: Process: com.myapp.app, PID: 19292
AndroidRuntime: android.view.InflateException: Binary XML file line #57 in com.myapp.app:layout/fragment_search_by_detail: Binary XML file line #57 in com.myapp.app:layout/fragment_search_by_detail: Error inflating class com.google.android.material.textfield.TextInputLayout
AndroidRuntime: Caused by: android.view.InflateException: Binary XML file line #57 in com.myapp.app:layout/fragment_search_by_detail: Error inflating class com.google.android.material.textfield.TextInputLayout
03-06 22:09:35.904 19292 19292 E AndroidRuntime: Caused by: java.lang.reflect.InvocationTargetException
03-06 22:09:35.904 19292 19292 E AndroidRuntime: 	at java.lang.reflect.Constructor.newInstance0(Native Method)

This can be fixed by changing themes for your text views from,

<style name="EditTextviewStyle" parent="TextAppearance.AppCompat">

to,

<style name="EditTextviewStyle" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">

</style>

2. If you get an error related to multidex, you can fix it by adding “multiDexEnabled true” into app/build.gradle as

android {
    defaultConfig {
        multiDexEnabled true
    }
}

If you want to use this theme as full screen then you can modify as,

<style name="MaterialAppThemeFullScreen" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="otpViewStyle">@style/OtpWidget.OtpView</item>

    <item name="windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="android:windowFullscreen">true</item>
    <item name="android:windowContentOverlay">@null</item>
</style>

lynxbee_ezoic

Subscribe with Valid Email Id to receive updates in Inbox. ( Secured by Google FeedBurner )

   


Leave a Comment

Android Android Applications Android Build system Android Commands Application Libraries Application Stack / User Interface Bash / Shell Scripts Bluetooth driver Cloud Technologies Commands and Packages Compilation Content Management System Core Kernel C Programs Development & Build Development, Debugging and Performance Tools Development Environment Setup Django & REST Api Errors & Failures Git Hardware Platforms HTML JAVA Programs Linux, OS Concepts and Networking Linux Device Drivers Linux Host, Ubuntu, SysAdmin Linux Kernel Linux Networking Middleware Libraries, HAL Multimedia Audio, Video, Images NDK / Middleware / HAL OS Concepts PHP Programming Languages Scripting and Automation Search Engine Optimisation ( SEO ) Social Media Source Code Management ( SCM ) System Administration, Security Testing and Debugging Uncategorized Web design and development Website Hosting Wordpress Yocto / Bitbake / Openembedded