Android XML: Drop shadow cut off

Question

I have a relative layout with a margin and a floating action button that is nested inside this layout.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="@dimen/activityMargin"
            android:orientation="vertical"
            android:clipToPadding="false">


<android.support.design.widget.FloatingActionButton
    android:id="@+id/id_FABSave"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentEnd="true"
    android:layout_alignParentRight="true"
    app:srcCompat="@drawable/ic_save_white"/>

</RelativeLayout>

As you can see in the attached picture, the drop shadow of the floating action button is cut off. How does this happen and how can it be fixed?

Answer 1

In your relative layout tag, use padding instead of margin and add the attribute android:clipToPadding="false" to avoid the shadows being cut.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="@dimen/activityMargin"
        android:clipToPadding="false">