Android elevation - same values different shadow

Question

I encountered a strange error while setting elevations to items in recycler-view. I have two item types in adapter, first is a kind of dashboard with complex layout with three cardviews. Second one is classic item for data list where each item has cardview as root. each cardview in both layouts is defined as follows

First Item Type :

<LinearLayout
        android:id="@+id/root"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    <android.support.v7.widget.CardView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="4dp"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="8dp"
            android:layout_marginBottom="8dp"
            app:cardCornerRadius="2dp"
            app:cardElevation="3dp"
            >

        ....

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

    ....

</LinearLayout>

Second Item Type:

<android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginBottom="8dp"
        app:cardCornerRadius="2dp"
        app:cardElevation="3dp"
        >

    ....

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

As you can see both cardviews have same elevation set but when i deploy this layout they have different shadows, any idea what could be the reason for this ?

I cut a part of screen and placed the cuts next to each other so you can see the problem ...

EDIT

Layout for first item is pretty complex, but all three cardviews in this item type have same shadow (the one on the left in image above). Root cardview of second item type has the shadow that's on the right in the image.

default_elevation = 3dp 
default_corner_radius = 2dp
margins are 16dp, 8dp, 4dp etc ...

First item type :

<layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <LinearLayout
        android:id="@+id/root"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/margin_and_half"
            android:layout_marginLeft="@dimen/default_padding"/>

        <android.support.v7.widget.CardView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/margin_quarter"
            android:layout_marginLeft="@dimen/margin_half"
            android:layout_marginRight="@dimen/margin_half"
            android:layout_marginBottom="@dimen/margin_half"
            app:cardCornerRadius="@dimen/default_corner_radius"
            app:cardElevation="@dimen/default_elevation"
            >

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:paddingLeft="@dimen/default_padding"
                android:paddingRight="@dimen/default_padding"
                android:paddingTop="@dimen/margin_and_half"
                android:paddingBottom="@dimen/margin_and_half"
                android:gravity="center_vertical">

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:gravity="bottom"
                    android:orientation="horizontal">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:textColor="@color/black"
                        android:textSize="48sp"

                        />

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:textColor="@color/black"
                        android:textSize="24sp"/>

                </LinearLayout>

                <LinearLayout
                    android:layout_width="0dp"
                    android:layout_weight="1"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="@dimen/default_padding"
                    android:gravity="center">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:paddingRight="@dimen/margin_half"
                        android:textColor="@color/green"
                        />

                    <ImageView
                        android:layout_width="@dimen/default_size"
                        android:layout_height="@dimen/default_size"/>

                </LinearLayout>

            </LinearLayout>

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

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:paddingTop="@dimen/default_padding"
            android:layout_marginLeft="@dimen/default_padding"
            android:layout_marginBottom="@dimen/margin_quarter"
            android:orientation="horizontal">

            <TextView
                android:layout_width="0dp"
                android:layout_weight="0.5"
                android:layout_height="wrap_content"/>

            <TextView
                android:layout_width="0dp"
                android:layout_weight="0.5"
                android:layout_height="wrap_content"
                android:layout_marginLeft="@dimen/margin_quarter"/>

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:paddingLeft="@dimen/margin_half"
            android:paddingRight="@dimen/margin_half"
            android:paddingBottom="@dimen/margin_default"
            android:clipChildren="false"
            android:clipToPadding="false"
            android:orientation="horizontal">

            <android.support.v7.widget.CardView
                android:layout_width="0dp"
                android:layout_weight="0.5"
                android:layout_height="wrap_content"
                android:layout_marginRight="@dimen/margin_quarter"
                app:cardCornerRadius="@dimen/default_corner_radius"
                app:cardElevation="@dimen/default_elevation">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    >

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:paddingTop="@dimen/margin_double"
                        android:paddingBottom="@dimen/margin_double"
                        android:layout_centerInParent="true"/>

                </RelativeLayout>

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

            <android.support.v7.widget.CardView
                android:layout_width="0dp"
                android:layout_weight="0.5"
                android:layout_height="wrap_content"
                app:cardCornerRadius="@dimen/default_corner_radius"
                app:cardElevation="@dimen/default_elevation">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:paddingTop="@dimen/margin_double"
                        android:paddingBottom="@dimen/margin_double"
                        android:layout_centerInParent="true"/>

                </RelativeLayout>

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

        </LinearLayout>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/margin_half"
            android:layout_marginLeft="@dimen/default_padding"
            android:layout_marginBottom="@dimen/margin_quarter"/>

    </LinearLayout>

</layout>

Second item type :

<?xml version="1.0" encoding="utf-8"?>
<layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <android.support.v7.widget.CardView
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:layout_marginLeft="@dimen/margin_half"
        android:layout_marginRight="@dimen/margin_half"
        android:layout_marginBottom="@dimen/margin_half"
        app:cardCornerRadius="@dimen/default_corner_radius"
        app:cardElevation="@dimen/default_elevation"
        >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:padding="@dimen/default_padding">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:paddingBottom="@dimen/margin_quarter"
                android:orientation="horizontal">

                <TextView
                    android:id="@+id/textview1"
                    android:layout_width="0dp"
                    android:layout_weight="1"
                    android:layout_height="wrap_content"/>

                <TextView
                    android:id="@+id/textview2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAllCaps="true"/>

            </LinearLayout>

            <TextView
                android:id="@+id/textview3"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@color/black"
                android:textAppearance="..(Too Long)"/>
        </LinearLayout>
    </android.support.v7.widget.CardView>
</layout>

Metamathematics

Any parent layout of cardview has elevation? Seems like the right one has more elevation in total. – Lobell

nope, only parent of the cardview on right is <layout> tag – Metamathematics

Could you post full layout xml? There is no way to understand without whole content. – Lobell

sure, check out the edit I made – Metamathematics

Answer 1

Had the same Problem, after some further investigation wanted to leave this here:

It seems to me, that the elevation is more focused on giving a feeling of depth than just "simply" casting a shadow. So, depending on where your view is located on the screen, the lighting is different and the shadow is casted differently, also the shadow is depending on the view's outline.

I recommend the following blog post in regard of this problem: https://blog.usejournal.com/playing-with-elevation-in-android-91af4f3be596

Also very helpful is the elevation-tester-app mentioned in the blog post: https://play.google.com/store/apps/details?id=me.seebrock3r.elevationtester&rdid=me.seebrock3r.elevationtester

But in conclusion I was not yet able to create an elevation based shadow which is consistent for every view regardless of on-screen-position :(

Federico