androidandroid-layoutandroid-toolbarmaterial-components-androidandroid-shapedrawable

How to make rounded corners for Toolbar?


I've seen other answers and they all apply to actionbars not toolbars and they require creating new shapes.

Is there a simple way to do this using the styles.xml?


Solution

  • It isn't what you are looking for because it is not with a xml.
    Currently (1.2.0-beta01 and 1.3.0-alpha01) the Toolbar or MaterialToolbar don't support a shapeAppearance style as other components in the styles.xml.
    But you can use in any case the ShapeAppearanceModel provided by the Material Components Library.

    In your layout:

    <com.google.android.material.appbar.MaterialToolbar
        android:id="@+id/toolbar"
        style="@style/Widget.MaterialComponents.Toolbar.Primary"
        android:layout_margin="4dp"
        ..>
    

    Then just apply the ShapeAppearanceModel with rounded corners:

        float radius = getResources().getDimension(R.dimen.default_corner_radius); //32dp
        MaterialToolbar toolbar = findViewById(R.id.toolbar);
      
        MaterialShapeDrawable materialShapeDrawable = (MaterialShapeDrawable)toolbar.getBackground();
        materialShapeDrawable.setShapeAppearanceModel(materialShapeDrawable.getShapeAppearanceModel()
                .toBuilder()
                .setAllCorners(CornerFamily.ROUNDED,radius)
                .build());
    

    enter image description here