How to give dropshadow for header and where body with gradient background in Android

Question

I have two layouts in my android project. In first layout

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    tools:context=".MainActivity"
    android:orientation="horizontal"
    android:background="@drawable/gradient"
   >
<View
    android:layout_width="13dp"
    android:layout_height="fill_parent"
    android:background="@drawable/shadow_left" />
</LinearLayout>

enter image description here

Shadow_Left.xml

 <shape xmlns:android="http://schemas.android.com/apk/res/android">
      <gradient
        android:startColor="#385469"
        android:endColor="#316a84"
        android:angle="180"
      >
     </gradient>
   </shape>

For next Layout, i tried the following code. enter image description here

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:background="@android:color/black"
        >
   <View
            android:layout_width="match_parent"
            android:layout_height="5dp"
            android:layout_alignParentBottom="true"
            android:background="@android:color/holo_blue_light" />
    </RelativeLayout>
   <View
    android:layout_width="wrap_content"
    android:layout_height="8dp"
    android:background="@drawable/shadow_top"/>
  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/gradient_right"
    android:orientation="horizontal"
    >

shadow_top.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android">
           <gradient
            android:startColor="#385469"
            android:endColor="@android:color/transparent"
            android:angle="270"
            >
        </gradient>
    </shape>

But instead of transparent end, it gives me a white end. The same output was there when i used a png shadow image there. In both cases transparent replaced by white end. How to attain the output as the second image?

Answer 1

Because your View is above the LinearLayout so if your View is transparent you will see the LinearLayout
The white color in your image is the color of LinearLayout.

To see this effect, you can change the LinearLayout color