Develop Reference

Shadow Layout with 9-patch and background color transparent?

I would like to add a custom layout an edge with shadow, exactly one like this:
http://inloop.github.io/shadow4android/
The problem is that I use this to add a semi / transparent background color: (corners_main_layout.xml)
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="6dp" />
<solid android:color="#color/bright_foreground_disabled_material_dark" />
</shape>
So I can not use for background 9-patch.
Is there any way to 9-patch with shadows and transparent background color?
If not .... How could make the effect?
PS: I have seen many custom XML to add shadows, but all are very poor.
Here example:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_recover_pass"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="...RecoverPassActivity"
android:background="#mipmap/fondo_01"
android:orientation="vertical">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/corners_main_layout">
</LinearLayout>
I Need shadow border rectangle White (it is transparent) similar to example 9-patch
------------EDIT---------------
I modified mi corners_main_layout.xml:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="6dp" />
<solid android:color="#color/bright_foreground_disabled_material_dark" />
</shape>
</item>
<item android:drawable="#drawable/shadow_custom" />
and result :-( :

yeah! i have solution!
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="6dp" />
<solid android:color="#color/bright_foreground_disabled_material_dark" />
</shape>
</item>
<item android:drawable="#drawable/shadow_custom_9patch"/>
</layer-list>
thanks for help!

android XML change gradient color

i need to change android:color in XML file in run-time
i use it for an image button source
<ImageButton
android:layout_width="#dimen/large_brush"
android:layout_height="#dimen/large_brush"
android:background="#android:color/transparent"
android:contentDescription="#string/paint"
android:src="#drawable/paint"/>
my XML paint file looks like this
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<stroke
android:width="1dp"
android:color="#android:color/holo_purple" />
<gradient
android:startColor="#android:color/holo_purple"
android:endColor="#android:color/holo_purple" />
<corners android:radius="10dp" />
</shape>
</item>
</layer-list>
i tried DOM parser but after getting to gradient it shows that there are no more nodes

Try like this way. Hope it should helpful for you. Thanks
Create a new xml file and put it in drawable and then add it to button as background
gradient.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- Gradient Bg for listrow -->
<gradient
android:startColor="#f1f1f2"
android:centerColor="#e7e7e8"
android:endColor="#cfcfcf"
android:angle="270" />
</shape>
layout.xml
<Button
android:id="#+id/Button1"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#drawable/gradient"
android:text="Button Text" >

You have the background set to transparent, the button will never have a background. Set it to you XML drawabale resource instead.

View with Solid Background and Top+Bottom Inner Shadows

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).

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

I prefer doing this than having to mess around with 9-Patches. Although, having said that, I wish Google would get on with providing built-in support for drop shadows, since they're so common.
Just to build on JoelFernandez solution with a more complete example:
The Container:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="[your_container_height]"
android:background="#drawable/container_bg_color">
<View
android:layout_width="match_parent"
android:layout_height="12dp"
android:layout_alignParentTop="true"
android:background="#drawable/container_gradient_top"/>
<View
android:layout_width="match_parent"
android:layout_height="12dp"
android:layout_alignParentBottom="true"
android:background="#drawable/container_gradient_bottom" />
<!-- Insert your content here -->
</RelativeLayout>
The Background Color (container_bg_color.xml):
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:thickness="0dp"
android:shape="rectangle">
<gradient android:startColor="#4a6fb4"
android:endColor="#color/deepBlue"
android:angle="135"/>
</shape>
The Top Gradient (container_gradient_top.xml):
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:thickness="0dp"
android:shape="rectangle">
<gradient
android:startColor="#00222222"
android:centerColor="#11111111"
android:endColor="#44000000"
android:angle="90"/>
</shape>
The Bottom Gradient (container_gradient_bottom.xml):
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:thickness="0dp"
android:shape="rectangle">
<gradient
android:startColor="#44000000"
android:centerColor="#11111111"
android:endColor="#00222222"
android:angle="90"/>
</shape>
Result:

Elaborating #ramaral's answer, build this drawable:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#FF408DAA"/>
</shape>
</item>
<item android:top="0dip" android:bottom="32dip">
<shape android:shape="rectangle">
<gradient android:startColor="#00000000" android:endColor="#50000000" android:angle="90"/>
</shape>
</item>
<item android:top="32dip" android:bottom="0dip">
<shape android:shape="rectangle">
<gradient android:startColor="#50000000" android:endColor="#00000000" android:angle="90"/>
</shape>
</item>
</layer-list>
You would need to set a fixed height in the view, in order to achieve the best result. In my case I was setting the height to "36dip". Notice that the "32dip" is the amount of space from where the gradient ends to the end of the drawable, so that would leave me with a top and bottom gradients of "4dip" (36-32=4 :p)

Start with this:
Create a drawable:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item >
<shape android:shape="rectangle">
<solid android:color="#408DAA"/>
</shape>
</item>
<item >
<shape android:shape="rectangle">
<solid android:color="#50000000"/>
</shape>
</item>
<item android:top="10dip" android:bottom="10dip">
<shape android:shape="rectangle">
<solid android:color="#408DAA"/>
</shape>
</item>
</layer-list>
Use it as background of any view.
Adjust top, bottom and color="#408DAA" according your needs

Android: how to create list background similar to one in gmail app?

In the attached screenshot of the Gmail app, the ListView's background seems to have a vertical gradient on the right side of the list to separate from the neighboring View.
I know I can define a GradientDrawable in xml, but how can I use this to draw a gradient as the background of one side of the list, while drawing the rest of the list's background as light grey?
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#DDDDDD"
android:endColor="#CCCCCC"
android:angle="0" />
</shape>

You just assign your the cutsom drawable you created as the background attribute of your ListView item. You can do this in the XML layout you are using to define your list element.
As an example, I use this layout (list_item.xml) to define a custom layout for my list items (and assign a gradient as a background):
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/list_item_gray_gradient"
android:orientation="horizontal"
...

You could create a drawable, and place it to the right of your the Layout containing your list items. So, your gradient is a separate component in your view, that sperated your ListView for the view on the right.
Something like this pseudo-code
<LinearLayout
android:orientation="horizontal"
<ListView
/>
<ImageView
android:background="#drawable/gradient_drawable"
>
>

I can setup the drawable to be 95% light grey, with the gradient on the right half, using the below:
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#DDDDDD"
android:centerColor="#DDDDDD"
android:endColor="#CCCCCC"
android:centerX=".95"
android:centerY=".95"
android:angle="0" />
</shape>

First Create this drawable : (drawable/list_gray_gradient.xml)
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- This is the line -->
<item>
<shape>
<solid android:color="#CCCCCC" />
</shape>
</item>
<!-- This is the main color -->
<item android:right="10dp">
<shape>
<solid android:color="#DDDDDD" />
</shape>
</item>
</layer-list>
And then just use this to your list item layout: (layout/list_item.xml)
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/list_gray_gradient" >
</RelativeLayout>

Listview divider margin

I'm trying to set a margin to a listview divider.
The divider is a dashed line:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="line" >
<stroke
android:dashGap="1dp"
android:dashWidth="1.5dp"
android:width="1dp"
android:color="#FF404040" />
<size android:height="3dp" />
</shape>
and a listview where i set the divider
<ListView
android:id="#+id/lv_news_feed_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/white"
android:divider="#drawable/ch_dashed_line_divider"
/>
but I want a divider margin left and right.
I also tried to set a padding to the shape, but the listview is ignoring the padding.
<padding
android:bottom="15dp"
android:left="15dp"
android:right="15dp"
android:top="15dp" />
Is there any possibility to set a margin to the listview divider - except in the getView() of the Adapter?

Inset is the way to go
<?xml version="1.0" encoding="UTF-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
android:insetLeft="15dp"
android:insetRight="15dp" >
<shape
android:shape="line" >
<stroke
android:dashGap="1dp"
android:dashWidth="1.5dp"
android:width="1dp"
android:color="#FF404040" />
<size android:height="3dp" />
</shape>
</inset>

Use 'inset'.....
(list_divider.xml)
<?xml version="1.0" encoding="UTF-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
android:insetLeft="50dp"
android:insetRight="50dp" >
<shape>
<solid android:color="#color/orange" />
<corners android:radius="2.0dip" />
</shape>
</inset>
and in your list view add like this...
<ListView
android:dividerHeight="2dp"
android:divider="#drawable/list_divider"
...
/>
you can set the inset value as desired...

You can use the following idea:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#color/table_background"/>
</shape>
</item>
<item android:left="2dp" android:right="2dp">
... your shape here ...
</item> </layer-list>
It works for me. Hope it will help.

U can use Gradient to get Right and Left margin instead of stroke.. Try this sample it starts and ends with black, in centre u'll get White.. It appears like u've given margin
<gradient android:startColor="#000000" android:centerColor="#ffffff"
android:endColor="#000000" />

I don't believe it is possible :/ Although if you add your own drawable at the bottom of each list item and remove the ListViews divider you can customize it however you want :)
Create the folder res/drawable and create a new xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#666666"></solid>
</shape>
..Then use that drawable in you list item.
Or a really quick and dirty way would ofc to create a thin LinearLayout (or some other layout) with colored background at the bottom of the list item to fake a customizable ListView divider..
Not a proper sollution, just some fixit ideas ;)