androidxmldropshadow

Android XML: Drop shadow cut off


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?

Bottom and right side of shadow cut off


Solution

  • 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">