How to add a drop shadow effect to a circular ImageView in Android?
I know this question is old, but here is my solution. I could not add a gradient to the stroke of an oval. The gradient always went to the center of the circle. A hack around this was to create a layer-list and make 5 concentric circles, each 1pd smaller that added their own shadding.
So, to make a drop shadow for a circular ImageView which is 180x180, and with the shadow goes from #1A000000 to #00000000, I did:
<?xml version="1.0" encoding="utf-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <shape android:shape="oval"> <stroke android:width="1dp" android:color="#00000000" /> <size android:width="190dp" android:height="190dp"/> </shape> </item> <item android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp"> <shape android:shape="oval"> <stroke android:width="1dp" android:color="#05000000" /> <size android:width="190dp" android:height="190dp"/> </shape> </item> <item android:top="2dp" android:right="2dp" android:bottom="2dp" android:left="2dp"> <shape android:shape="oval"> <stroke android:width="1dp" android:color="#0A000000" /> <size android:width="190dp" android:height="190dp"/> </shape> </item> <item android:top="3dp" android:right="3dp" android:bottom="3dp" android:left="3dp"> <shape android:shape="oval"> <stroke android:width="1dp" android:color="#0F000000" /> <size android:width="190dp" android:height="190dp"/> </shape> </item> <item android:top="4dp" android:right="4dp" android:bottom="4dp" android:left="4dp"> <shape android:shape="oval"> <stroke android:width="1dp" android:color="#15000000" /> <size android:width="190dp" android:height="190dp"/> </shape> </item> <item android:top="5dp" android:right="5dp" android:bottom="5dp" android:left="5dp"> <shape android:shape="oval"> <stroke android:width="1dp" android:color="#1A000000" /> <size android:width="190dp" android:height="190dp"/> </shape> </item></layer-list>
If you have Lollipop or above, you can use this:
public static void setOvalElevationToView(final View view) { if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP) view.setOutlineProvider(new ViewOutlineProvider() { @TargetApi(VERSION_CODES.LOLLIPOP) @Override public void getOutline(View view, Outline outline) { final int size = view.getWidth(); outline.setOval(0, 0, size, size); } });}You might also need to disable clipping on the parent of the view, so that the shadows won't be clipped
Can't you use a layered drawable and add another ring shape, or circle, with small offset shift below to create a drop shadow effect ?
Something like :
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <item android:drawable="@drawable/shadow" android:id="@id/shadow" android:top="dimension" android:right="dimension" android:bottom="dimension" android:left="dimension" /> <item android:drawable="@drawable/hh" android:id="@id/ring" android:top="dimension" android:right="dimension" android:bottom="dimension" android:left="dimension" /></layer-list>Where shadow is something like
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="circle"> <gradient android:centerColor="@android:color/darker_gray" android:endColor="@android:color/darker_gray" android:startColor="@android:color/darker_gray" /> <size android:height="140dp" android:width="120dp" /> </shape>