Cardview only top corner radius?

[MujahidHi5]

I need to add only top corner radius but i can see only app:cardCornerRadius="20" How can i do it?

[Berki2021]

You have to create a custom style for this. Within your styles.xml add the following:

    <style name="CustomCardCorners" parent="@style/Widget.MaterialComponents.CardView">
        <item name="shapeAppearanceOverlay">@style/ShapeAppearance_custom_corners</item>
    </style>

    <style name="ShapeAppearance_custom_corners" parent="">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSizeTopLeft">4dp</item>
        <item name="cornerSizeTopRight">4dp</item>
    </style>

And then for your cardview, do:

<com.google.android.material.card.MaterialCardview
          style="@style/CustomCardCorners"
          // .. some other stuff  
/>

[richanshah]

not working at all

[Shvet]

I have check above code but didnt work as apected, So i searched on StackOverflow and found ShapeAppearanceModel can be used to make corners for different sizes.

This is how I set topleft and topright corners in my screen,

<com.google.android.material.card.MaterialCardView
            android:id="@+id/cardview"
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@id/guideline">

Below is Kotlin code:

   `  val leftShapePathModel = ShapeAppearanceModel().toBuilder()
        // You can change style and size
        leftShapePathModel.setTopLeftCorner(
            CornerFamily.ROUNDED,
            CornerSize { return@CornerSize 80F })

        leftShapePathModel.setTopRightCorner(
            CornerFamily.ROUNDED,
            CornerSize { return@CornerSize 80F })

        val bg = MaterialShapeDrawable(leftShapePathModel.build())
        // In my screen without applying color it shows black background
        bg.fillColor = ColorStateList.valueOf(
            requireContext().resources.getColor(android.R.color.white)
        )
        bg.elevation = 8F

        cardview.background = bg
        cardview.invalidate()`

[ReejeshPK]

I have check above code but didnt work as apected, So i searched on StackOverflow and found ShapeAppearanceModel can be used to make corners for different sizes.

This is how I set topleft and topright corners in my screen,

<com.google.android.material.card.MaterialCardView
            android:id="@+id/cardview"
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@id/guideline">

Below is Kotlin code:

   `  val leftShapePathModel = ShapeAppearanceModel().toBuilder()
        // You can change style and size
        leftShapePathModel.setTopLeftCorner(
            CornerFamily.ROUNDED,
            CornerSize { return@CornerSize 80F })

        leftShapePathModel.setTopRightCorner(
            CornerFamily.ROUNDED,
            CornerSize { return@CornerSize 80F })

        val bg = MaterialShapeDrawable(leftShapePathModel.build())
        // In my screen without applying color it shows black background
        bg.fillColor = ColorStateList.valueOf(
            requireContext().resources.getColor(android.R.color.white)
        )
        bg.elevation = 8F

        cardview.background = bg
        cardview.invalidate()`

With reference to this answer, using ShapeAppearanceModel.Builder , we can also set it directly using:

 val topcard=view.findViewById<MaterialCardView>(R.id.topcard)
 var shapeAppearanceModel: ShapeAppearanceModel.Builder =ShapeAppearanceModel().toBuilder()
 shapeAppearanceModel.setTopLeftCorner(
            CornerFamily.ROUNDED,
            CornerSize { return@CornerSize 80F })
topcard.shapeAppearanceModel =shapeAppearanceModel.build()

Thanks to @Shvet

[dianamelga]

Does this work with 1.6.0 version? I tried with this following your examples, but so far is not working for me

<com.google.android.material.card.MaterialCardView
            android:id="@+id/card_view_video_player"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:cardElevation="0dp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toBottomOf="@id/tv_description"
            android:layout_marginTop="@dimen/dp_80px"
            app:cardBackgroundColor="@android:color/transparent">

            <com.unknown.presentation.views.ui.videoplayer.MyCustomExoPlayer
                android:id="@+id/video_player"
                android:layout_width="@dimen/dp_605px"
                android:layout_height="@dimen/dp_1023px" />

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

val topcard = binding.cardViewVideoPlayer
        val shapeAppearanceModel = ShapeAppearanceModel().toBuilder()
        shapeAppearanceModel.setTopLeftCorner(
            CornerFamily.ROUNDED,
            CornerSize { return@CornerSize 80F })

        shapeAppearanceModel.setTopRightCorner(
            CornerFamily.ROUNDED,
            CornerSize { return@CornerSize 80F })

        topcard.shapeAppearanceModel = shapeAppearanceModel.build()