I have a recyclerview
, which i've added a elevation
to. It seems that elevation gets higher depending on where on the screen the item is located vertically, the shadow grows as the item gets scrolled down. I've tried adding a background color, which has not helped. I found another post with a video showing the problem. https://youtu.be/nROYq8rpUMs
Here's my relativelayout where I add the elevation.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#EDEDED"
android:focusable="?attr/selectableItemBackground"
android:layout_marginTop="15dp"
android:layout_marginBottom="15dp"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:id="@+id/newsRowRelativeLayout"
android:elevation="4dp">
<ImageView
android:id="@+id/newsImage"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:maxHeight="300dp"
android:layout_marginTop="5dp"
android:layout_marginBottom="15dp"
android:scaleType="centerCrop"
android:adjustViewBounds="true"
android:background="@color/mainTextBGColor" />
<TextView
android:id="@+id/newsTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@android:color/transparent"
android:layout_below="@id/newsType"
android:textStyle="bold"
android:textColor="@color/news_title"
android:paddingLeft="@dimen/activity_margin"
android:paddingRight="@dimen/activity_margin"
android:textSize="@dimen/news_title_main" />
<TextView
android:id="@+id/newsType"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@android:color/transparent"
android:layout_below="@id/newsImage"
android:textStyle="bold"
android:textAllCaps="true"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:textColor="@color/mainBGColor"
android:paddingLeft="@dimen/activity_margin"
android:paddingRight="@dimen/activity_margin"
android:textSize="@dimen/news_tag_detailed" />
<TextView
android:id="@+id/newsText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/newsTitle"
android:background="@android:color/transparent"
android:ellipsize="end"
android:maxLines="3"
android:textColor="@color/news_text"
android:layout_marginTop="10dp"
android:layout_marginBottom="5dp"
android:paddingLeft="@dimen/activity_margin"
android:paddingRight="@dimen/activity_margin"
android:textSize="@dimen/news_text_main"/>
</RelativeLayout>
There's nothing wrong with it. The Elevation effect uses a so called Key-Light and Ambient-Light. One sits right above the screen (Ambient-Light), the other one (Key-Light) with a 45° angle above the screen. That's why the shadow is moving while you're scrolling.
tl;dr The shadow is not static but dynamically calculated. See also the following picture explaining the concept: