Rounded Rectangle ImageView in Android

Hi All,

In this tutorial i am going to show you how to implement Rounded Rectangle ImageView in android.

Create a Class named "RoundedCornerImageView"

import android.content.Context;import android.graphics.Bitmap;import android.graphics.Bitmap.Config;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.PorterDuff.Mode;import android.graphics.PorterDuffXfermode;import android.graphics.Rect;import android.graphics.drawable.BitmapDrawable;import android.graphics.drawable.Drawable;import android.util.AttributeSet;import android.widget.ImageView;
public class RoundedCornerImageView extends ImageView {

    public RoundedCornerImageView(Context ctx, AttributeSet attrs) {
        super(ctx, attrs);    }

    @Override    protected void onDraw(Canvas canvas) {

        Drawable drawable = getDrawable();
        if (drawable == null) {
            return;        }

        if (getWidth() == 0 || getHeight() == 0) {
            return;        }
        Bitmap b = ((BitmapDrawable) drawable).getBitmap();        Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true);
        int w = getWidth(), h = getHeight();
        Bitmap roundBitmap = getRoundedCroppedBitmap(bitmap, w,h);        canvas.drawBitmap(roundBitmap, 0, 0, null);
    }

    public static Bitmap getRoundedCroppedBitmap(Bitmap bitmap, int width,int height) {
        Bitmap finalBitmap;        if (bitmap.getWidth() != width || bitmap.getHeight() != width)
            finalBitmap = Bitmap.createScaledBitmap(bitmap, width, height,                    false);        else            finalBitmap = bitmap;        Bitmap output = Bitmap.createBitmap(finalBitmap.getWidth(),                finalBitmap.getHeight(), Config.ARGB_8888);        Canvas canvas = new Canvas(output);
        final Paint paint = new Paint();        final Rect rect = new Rect(0, 0, finalBitmap.getWidth(),                finalBitmap.getHeight());
        paint.setAntiAlias(true);        paint.setFilterBitmap(true);        paint.setDither(true);        canvas.drawARGB(0, 0, 0, 0);        paint.setColor(Color.parseColor("#BAB399"));        canvas.drawRoundRect(0,0, finalBitmap.getWidth() , finalBitmap.getHeight()  , 50, 50, paint);        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));        canvas.drawBitmap(finalBitmap, rect, rect, paint);
        return output;    }

}

Add RoundedCornerImageView  in XML followed by the packagename in which the RoundedCornerImageView is placed.

like <com.nitij.customcomponents.RoundedCornerImageView >

<?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="fill_parent" >
 <com.nitij.customcomponents.RoundedCornerImageView

    android:layout_width="200dp"
    android:id="@+id/image"    android:layout_centerInParent="true"    android:layout_height="200dp" />
     

</RelativeLayout>

change width and height as desired.

In Activity where you have inflated the layout implement the following.

RoundedCornerImageView imageView = (RoundedCornerImageView) findViewById(R.id.image1);Bitmap bmp = BitmapFactory.decodeResource(getResources(), R.drawable.img_background);imageView.setImageBitmap(bmp);

Output