android material button cannot remove round corners

Viewed 1764

I need to remove round corners of all buttons in app and use flat background. preferably a color.

This is my style:

<style name="Component.MyTheme.Button" parent="Widget.MaterialComponents.Button.TextButton">
    <item name="android:textColor">@color/white_50</item>
    <item name="backgroundTint">@color/black</item>
    <item name="cornerRadius">@null</item>
</style>

and this is how I apply it in my theme.

<item name="materialButtonStyle">@style/Component.MyTheme.Button</item>

I want to change this

enter image description here

to this

enter image description here

EDIT : Ignore white bars at either ends of 2nd image.

3 Answers

set corner radius attibute to 0dp.

app:cornerRadius="0dp"

Like below code

<com.google.android.material.button.MaterialButton
            android:id="@+id/button_filter_apply"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="@string/apply"
            android:fontFamily="sans-serif"
            android:textAllCaps="true"
            android:textColor="@color/white"
            android:textStyle="bold"
            app:backgroundTint="@color/clear_blue"
            app:cornerRadius="0dp"
            app:layout_constraintBottom_toBottomOf="parent" />

Button looks like

enter image description here

EDIT : Ignore black bars on both side of the image

Just use:

<style name="Component.MyTheme.Button" parent="Widget.MaterialComponents.Button.TextButton">
    ...
    <item name="cornerRadius">0dp</item>
</style>

or

<style name="MyButton" parent="Widget.MaterialComponents.Button.TextButton">
    ...
    <item name="shapeAppearanceOverlay">@style/shapeAppearanceOverlay_noCorner</item>
</style>

<style name="shapeAppearanceOverlay_noCorner" parent="">
    <item name="cornerSize">0dp</item>
</style>

enter image description here

As you said you would like to add themes to your button. Can you please try adding 0.1 to your corner radius?

Related