CardView background colour is trimmed

user_5523147 0
Viewed 238

I have set the corner radius of CardView to 50 dp to get the roundest corner. But in some phones (I have seen in android 8) the card background colour is getting trimmed. Although the shadow/card elevation is rounded but the background colour is not. What might be going wrong here ? Thanks in advance.

marked views are cardviews

cornerradius android-cardview background-color android
3 Answers

Setting android:outlineProvider="none" on CardView in xml fixed the issue for me!

user_72096730

Instead of using a corner radius of 50dp use the shapeAppearanceOverlay attribute to define a corner with 50%:

    <com.google.android.material.card.MaterialCardView
        app:shapeAppearanceOverlay="@style/ButtomShape50"
        app:cardBackgroundColor="@color/...."
        ...>

with:

<style name="ButtomShape50">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">50%</item>
</style>

enter image description here

Programmatically you can do:

cardView.setShapeAppearanceModel(cardView.getShapeAppearanceModel()
            .toBuilder()
            .setAllCorners(new RoundedCornerTreatment()).setAllCornerSizes(new RelativeCornerSize(0.5f))
            .build());

Just a note about new RelativeCornerSize(0.5f): It changed in 1.2.0-beta01. Before it was new RelativeCornerSize(50)).

In your case you can also use a FloatingActionButton or a ExtendedFloatingActionButton without using the CardView.

<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
        app:elevation="4dp"
        app:shapeAppearanceOverlay="@style/ButtomShape50"/>

enter image description here

user_20165620

Are you using android:background for the background color of the cardview? You should use app:cardBackgroundColor.

user_133278440
Related