Drop shadow renders without transparency

Question

In this project (feature/drop-shadow branch) I am trying to add a drop shadow above a view container. Therefore, I defined the following shape (drawable/shadow_above):

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
            android:startColor="#20000000"
            android:endColor="@android:color/transparent"
            android:angle="90">
    </gradient>
</shape>

This is then used in the layout file (container_infos.xml) as follows:

<View
    android:background="@drawable/shadow_above"
    android:layout_width="match_parent"
    android:layout_height="4dp"/>

The screenshot shows the result. For some reason the drop shadow looks awful. There is no transparency. What am I doing wrong? Feel free to send a pull request to my open source project.

---

Solution using a RelativeLayout

I managed to get the desired result by using a RelativeLayout in fragment_map.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:tools="http://schemas.android.com/tools"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:orientation="vertical"
              tools:context=".ui.MainActivity">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <FrameLayout
            android:id="@+id/map_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            tools:background="@android:color/holo_purple"/>

        <View
            android:background="@drawable/shadow_above"
            android:layout_alignBottom="@id/map_container"
            android:layout_width="match_parent"
            android:layout_height="4dp"/>

    </RelativeLayout>

    <include
        layout="@layout/container_infos"/>

</LinearLayout>

There might be room for optimization.

Answer 1

as far as I see you should give map_container_infos_layout a negative top margin of the size 4dp and it should look better