how to set shadow to a View in android?

Question

I want to know how to add a shadow layer to any general View in android. for eg: suppose i have a layout xml, showing something like this..

<?xml version="1.0" encoding="utf-8"?>   <LinearLayout       android:layout_height="wrap_content"       android:layout_width="wrap_content"       <Button....       ...   </LinearLayout>   

Now when it is displayed I want to have a shadow around it.

Answer 1

The best way to create a shadow is to use a 9patch image as the background of the view (or a ViewGroup that wraps the view).

The first step is to create a png image with a shadow around it. I used photoshop to create such an image. Its really simple.

• Create a new image with Photoshop.
• Add a layer and create a black square of 4x4.
• Create a shadow on the layer by selecting the layer in layer explorer and clicking on a button titled fx and choosing drop shadow.
• Export the image as png.

The next step is to create 9-patch drawables from this image.

• Open draw9patch from android-sdk/tools
• Open the image in draw9patch
• Create 4 black lines on the four sides of the square like the following and then save the image as shadow.9.png.

Now you can add this shadow as the background of the views you want to add the shadow to. Add shadow.9.png to res/drawables. Now add it as a background:

<LinearLayout   android:layout_width="fill_parent"   android:layout_height="wrap_content"   android:background="@drawable/shadow"   android:paddingBottom="5px"   android:paddingLeft="6px"   android:paddingRight="5px"   android:paddingTop="5px" > 

I recently wrote a blog post that explains this in detail and includes the 9patch image that I use for creating the shadow.