View with Solid Background and Top+Bottom Inner Shadows

Question

Essentially, I am trying to create the following background:

The traditional gradient which use in the drawable that I use for background only supports start color, middle color and end color.

However, as you can see from the mockup, I am trying to create only a slight overlay/shadow at the top and bottom of the shape, with a #50000000 color (black with 50% opacity).

Answer 1

If you're using this inside a Layout view, then you can simply create a View with a gradient background and place it in the beginning and in the end of the Layout.

For example:

    <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@+id/parent">

            <View 
                android:layout_width="fill_parent"
                android:layout_height="5dp"
                android:background="@drawable/gradient" />

<!-- Your other child views -->


            <View 
                android:layout_width="fill_parent"
                android:layout_height="5dp"
                android:background="@drawable/gradient" />

</LinearLayout>

And your gradient.xml file will have this:

<shape xmlns:android="http://schemas.android.com/apk/res/android">
   <gradient android:startColor="#FFFFFF" android:endColor="#000000" android:angle="90"/>
 </shape>

You can specify the blue background color to the parent layout.

You'll essentially get something like this:

[EDIT]

You can create two drawables - gradient_top.xml and gradient_bottom.xml to get the angle right