4

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.

2
  • did you tried giving 0 as the value to the cornerRadius Aug 8, 2020 at 16:27
  • 1
    hi. both @Pritish Deshpande and your solution works. Thanks. Aug 8, 2020 at 17:19

3 Answers 3

9

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

2

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

0

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

4
  • because themes allow a consistent way of handling look of the app. Aug 8, 2020 at 17:17
  • @ChandanPednekar Edited answer please see. Aug 8, 2020 at 17:20
  • your edit is what @vikas kumar suggested. but I found ShapeAppearance to be a subtly nice way of overriding parameters. Aug 8, 2020 at 17:33
  • No worries. Happy coding!! Aug 8, 2020 at 17:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.