ImageView rounded corners [duplicate]

Question

I wanted image to have rounded corners. I implement this xml code and use this in my image view. but image overlap the shape. I am downloading the image through async task.

<?xml version="1.0" encoding="utf-8"?>  <shape xmlns:android="http://schemas.android.com/apk/res/android"  android:shape="rectangle" >  <corners android:radius="20dip" /> </shape>   <ImageView     android:id="@+id/trVouchersImage"     android:layout_width="55dp"     android:layout_height="55dp"     android:layout_marginLeft="8dp"     android:layout_centerVertical="true"     android:layout_centerHorizontal="true"     android:layout_alignParentLeft="true"     android:background="@drawable/ash_arrow"  /> 

Answer 1

SIMPLEST APPROACH:

Create an xml file rounded_fg.xml under res/drawable/ folder of your app. The content of rounded_fg.xml is as follows,

<?xml version="1.0" encoding="UTF-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"     android:innerRadiusRatio="2"     android:shape="ring"     android:thicknessRatio="1"     android:useLevel="false">     <gradient         android:type="radial"         android:gradientRadius="8dp"         android:endColor="@color/white"        /> </shape> 

You can match endColor with ImageView container layout background & gradientRadius may be any value as per your requirements (<=36dp).

Now use this drawable as foreground for your imageview as follows,

 <ImageView      android:layout_width="55dp"      android:layout_height="55dp"       android:foreground="@drawable/rounded_fg" /> 

Works perfect with square images and/or imageview.

Square Image/ImageView:

Rectangular Image/ImageView:

Foreground applied over a button: