No layout preview visible after setting app theme to material design and using material button

I am using the material design as my app theme, but due to this, there is some issue while viewing the layout preview in android studio. There is no preview displayed but when I run the code I am able to view the design on the device.

The issue is mainly because of the material button I have used. when I comment the button code the preview is shown, but when I uncomment the code and refresh the layout the preview is again not visible.

Below is the code od how I have applied the material theme to my app:

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
</style> 

Below is the Code I have used in my layout:

<?xml version="1.0" encoding="utf-8"?>

<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">


    <TextView
            android:id="@+id/tvTitle"
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content"
            android:text="@string/app_name"
            android:layout_marginTop="115dp"
            android:layout_centerHorizontal="true"
            android:textSize="30dp"
            style="@style/text_sui_generis"
            android:textColor="@color/colorPrimary"/>

    <RelativeLayout
            android:id="@+id/rlSpinner"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/tvTitle"
            android:layout_marginTop="80dp"
            android:layout_centerHorizontal="true"
            android:background="@drawable/border_shadow"
            android:padding="5dp">

        <ImageView android:layout_width="20dp"
                   android:layout_height="20dp"
                   android:src="@drawable/ic_location"
                   android:id="@+id/locationImage"
                   android:layout_centerVertical="true"/>

        <Spinner
                android:id="@+id/locationSpinner"
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content"
                android:layout_toEndOf="@id/locationImage"
                android:layout_marginStart="5dp"
                android:layout_centerVertical="true"/>

    </RelativeLayout>

    <com.google.android.material.button.MaterialButton
            android:id="@+id/signin_btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/sign_in"
            style="@style/buttonCustomFont"
            android:layout_below="@id/rlSpinner"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="60dp"
            android:elevation="1dp"/>

</RelativeLayout>