CODEWITHSUNDEEP
androidandroid-layoutandroid-buttonmaterial-components-androidmaterialbutton
Henry Twist
Henry Twist

Reputation: 5980

Setting perfectly circular rounded corners on a MaterialButton in XML

So I have been trying to find a way to make a MaterialButton from the Material Components library have perfectly rounded corners. What I mean by this is effectively they have a corner size of 50% the height of the button.

In some of the documentation it indicates that this should be possible with the quote below.

Shape size can be determined using a value that is either absolute or a percentage.

I have a couple of working solutions, firstly measuring the view and setting the corner size that way, but then I discovered that the ExtendedFloatingActionButton uses a RelativeCornerSize object.

However, I still cannot find a solution in XML.

Upvotes: 1

Views: 1556

Answers (2)

Gabriele Mariotti
Gabriele Mariotti

Reputation: 363825

You can use the shapeAppearanceOverlay attribute.

<com.google.android.material.button.MaterialButton
    app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.Button.50"
    .../>

with:

  <style name="ShapeAppearanceOverlay.Button.50" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">50%</item>
  </style>

You can use an absolute or a percentage value.

enter image description here

Upvotes: 3

codearn19
codearn19

Reputation: 181

There are specific commands with Material Design.

I could not explain it better than this answer

It works with Android Studio 3.1 or higher

Upvotes: 0

Related Questions