I have a recyclerview with an elevation of 8dp, transparent background and bounds as outlineProvider. clipToPadding is set to false on the parent relativelayout. I am facing a weird issue w.r.t the shadow cast by the recyclerview elevation. The shadow seems to cover up the edges of the recyclerview or there is an extra layer between the relativelayout and the child recyclerview (Attached an image reference). What is actually causing this effect? I have searched a lot but could not find any explanation.Any suggestions are welcome.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/activity_grid_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false">
<android.support.v7.widget.RecyclerView
android:id="@+id/grid_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="110dp"
android:layout_marginLeft="15dp"
android:layout_marginTop="80dp"
android:background="@color/transparent"
android:outlineProvider="bounds"
android:elevation="8dp"
android:padding="0dp"
android:scrollbars="none" />
<ImageView
android:id="@+id/grid_main_filter_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:layout_alignBottom="@+id/grid_recycler_view"
android:layout_alignStart="@+id/grid_recycler_view"
android:layout_marginBottom="-18dp"
android:layout_marginStart="67dp"
android:elevation="10dp"
android:background="@drawable/main_filter" />
<ImageView
android:id="@+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:layout_marginBottom="36dp"
android:layout_marginLeft="27dp"
android:src="@drawable/hive" />
<ImageView
android:id="@+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="36dp"
android:layout_marginLeft="24dp"
android:layout_toEndOf="@+id/imageView2"
android:src="@drawable/sway" />
<ImageView
android:id="@+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="36dp"
android:layout_marginLeft="24dp"
android:layout_toEndOf="@+id/imageView3"
android:src="@drawable/colony" />
<ImageView
android:id="@+id/imageView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="36dp"
android:layout_marginLeft="24dp"
android:layout_toEndOf="@+id/imageView4"
android:src="@drawable/vault" />
<ImageView
android:id="@+id/imageView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_marginBottom="36dp"
android:layout_marginRight="28dp"
android:src="@drawable/camera" />
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/progressBar"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:visibility="gone"/>
recycler_view_child_item
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="0dp">
<ImageView
android:id="@+id/thumbnail"
android:layout_width="84dp"
android:layout_height="150dp"
android:layout_margin="0dp"
android:padding="0dp" />
</LinearLayout>
The first shadow is cast by the RecyclerView, the second is cast on top of the RecyclerView by the first ImageView child. Both shadows look fine. Maybe you can highlight the part of the image which is not correct according to you?
The shadow is not on the top but behind the RecyclerView. This shadow is visible because you have transparent background of the RecyclerView. The shadow is rendered under the RecyclerView but not the whole surface is painted, just some area around the edges.
This might be an optimisation or a side effect, I'm not sure, but I've been observing this 'effect'. I guess this is normal and intended. If you make a solid backgound color, the not nice part will be covered.