RecyclerView don't clip item in the corner

Question

I want to make recyclerView round corner but seem like if the child item has background color, it will cover to the recyclerView and couldn't be clipped. Here is the design If I remove the background color of item, then it could be like my design. But unfortunately, sometime it has blue background

Here is what my app show

Here is my item layout

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/item_popover"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="@dimen/dp_8"
    android:background="@color/white"
    tools:ignore="RtlHardcoded,RtlSymmetry"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <com.jp.base.customView.AppImageView
        android:id="@+id/img_notification"
        android:paddingRight="@dimen/dp_8"
        app:srcCompat="@mipmap/ic_launcher_round"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:layout_marginStart="@dimen/dp_8"
        android:layout_marginEnd="@dimen/dp_8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <android.support.v7.widget.AppCompatImageView
        android:id="@+id/img_arrow"
        app:srcCompat="@drawable/ic_keyboard_arrow_right_blue_24dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <com.jp.base.customView.AppTextView
        android:id="@+id/tv_message"
        tools:text="Message....\nMessage"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toEndOf="@id/img_notification"
        app:layout_constraintEnd_toStartOf="@id/img_arrow"
        android:maxLines="5"
        android:layout_marginTop="@dimen/dp_5"
        android:textColor="@color/black"
        android:layout_width="0dp"
        android:layout_height="wrap_content" />

    <com.jp.base.customView.AppTextView
        android:id="@+id/tv_time"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/dp_8"
        android:drawablePadding="@dimen/dp_8"
        android:gravity="center_vertical"
        android:textSize="@dimen/text_small"
        app:app_leftDrawable="@drawable/ic_access_time_black_24dp"
        app:layout_constraintHorizontal_bias="0"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/img_arrow"
        app:layout_constraintStart_toEndOf="@id/img_notification"
        app:layout_constraintTop_toBottomOf="@+id/tv_message"
        app:layout_constraintVertical_bias="100"
        tools:text="a month ago" />

    <View
        app:layout_constraintTop_toBottomOf="@id/tv_time"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_marginTop="@dimen/dp_8"
        android:background="@color/gray"
        android:layout_width="0dp"
        android:layout_height="0.5dp" />

</android.support.constraint.ConstraintLayout>

My RecyclerView:

<android.support.v7.widget.RecyclerView
            android:id="@+id/list_notification"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginTop="-30dp"
            android:background="@drawable/rect_bound_bottom_5dp"
            android:clipChildren="true"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@id/tv_popup_title"
            tools:listitem="@layout/item_popover" />

Answer 1

Most easy solution will be

Just wrap your RecyclerView inside CardView.

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:cardCornerRadius="50dp"
    tools:cardElevation="0dp">

    <android.support.v7.widget.RecyclerView
        ... 
        />
</android.support.v7.widget.CardView>

Use cardCorderRadius to change corner radius.

Answer 2

I would try:

• Setting "round rect" Outline on the Recycler View - setOutline

• This is usually used to provide a shadow effect together with "elevation" but if you don't need a shadow - you can skip the elevation part

• Finally call setClipToOutline again on the RecyclerView