MaterialButton is appearing weird on preview and on device as well

Issue

I am using MaterialButton but it is not appearing correctly.

Here is the code I am using

<com.google.android.material.button.MaterialButton
    android:id="@+id/verifyOTP"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Verify OTP"
    android:layout_marginTop="10dp"/>

Here is current display

This is the dependency I am using

'com.google.android.material:material:1.5.0'

This is the behavior I am expecting

Please help me how to resolve this problem.

Note: Button is working fine only MaterialButton is not working correctly

Solution

Try to add style attribute to your MaterialButton declaration :

<com.google.android.material.button.MaterialButton
android:id="@+id/verifyOTP"
style="@style/Widget.MaterialComponents.Button.TextButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="20dp"
android:text="..."/>

Answered By - ismail alaoui