Android transparent shadow white line at the end of gradient

Question

I need help with android drawable linear gradient, using custom gradient as shadow from toolbar but I can`t get rig of white line at the end of my gradient.

XML layout, last RelativeLayout child element View is dropping shadow.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
    <android.support.v7.widget.Toolbar xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:titleTextColor="@android:color/white"
        android:weightSum="1">

        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout_main"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:tabIndicatorColor="@color/tabIndicator"
            app:tabIndicatorHeight="3dp"
            app:tabMode="fixed"
            app:tabPaddingEnd="12dp"
            app:tabTextAppearance="@style/customTabLayout"
            android:layout_weight="0.90"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true">

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />

        </android.support.design.widget.TabLayout>


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

<android.support.v4.view.ViewPager
    android:id="@+id/viewPager_main"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_alignParentBottom="true"
    android:layout_below="@+id/toolbar" />

<View
    android:layout_width="match_parent"
    android:layout_height="14dp"
    android:background="@drawable/drop_shadow"
    android:layout_below="@+id/toolbar"/>
</RelativeLayout>

Drawable with gradient

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
    android:type="linear"
    android:angle="270"
    android:endColor="#00000000"
    android:startColor="#5a000000" />
</shape>

Answer 1

In fact, there is no line

It is an optical effect that appears because the gradient is linear. The color goes from black to transparent smoothly, but the "speed" at which the color becomes transparent changes sharply at the very end. You can read more here

To fix this problem you need to make the gradient ease-out. Since Android does not support different curvature of the gradient, there are several solutions:

1. Nine-patch (recommended)
   Create desired gradient in vector graphic editor and based on it create Nine-patch drawable. Read more about 9-patch: https://developer.android.com/guide/topics/graphics/drawables#nine-patch

2. Multiple linear gradients
   Create a set of linear gradients with selected color values, so that the curvature in the approximation corresponds to a ease-out one