How to make child ImageView take the shape appearance of the parent MaterialCardView?

Question

I have a MaterialCardView which has the following shape appearance:

I want to put an ImageView in there which takes the exact shape appearance of the MaterialCardView.

Following is the stuff I have tried:

MaterialCardView Setting:

app:cardPreventCornerOverlap="false"
android:clipChildren="true"

I think the above setting works only with original card view for card corner radius

I know that you can create a shape xml or CustomImageView to achieve it.

But I just want to know if there is a direct way to clip all the childrens.

Note: I am using MaterialCardView from Material library not the regular CardView

Answer 1

Just use the ShapeableImageView and apply the same corners.
Something like:

    <com.google.android.material.card.MaterialCardView
        app:cardBackgroundColor="@color/white"
        app:shapeAppearanceOverlay="@style/roundedImageView16"
        app:cardPreventCornerOverlap="false"
        ..>

        <com.google.android.material.imageview.ShapeableImageView
            android:padding="8dp"
            app:shapeAppearanceOverlay="@style/roundedImageView16"
        ../>

    </com.google.android.material.card.MaterialCardView>

with:

  <style name="roundedImageView16">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">16dp</item>
  </style>

Note: it requires at least the version 1.2.0-alpha03.