Crop Image as circle in Android

Question

Does anyone know how to crop an image\bitmap to a circle? I can not find any solution, sorry ..

@user1281750 read question detail exactly! It's not duplicate any how! — Paresh Mayani, Feb 13 '14 at 13:57
possible duplicate of [Cropping Circular Area from bitmap in android](http://stackoverflow.com/questions/11932805/cropping-circular-area-from-bitmap-in-android) — Adinia, Mar 17 '14 at 11:15

score 9 · Answer 1 · edited Oct 02 '20 at 16:26

For having rounded corners for ImageView, convert your image into bitmap and then try following code :

private Bitmap getRoundedCroppedBitmap(Bitmap bitmap) {
    int widthLight = bitmap.getWidth();
    int heightLight = bitmap.getHeight();
    
    Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(),
            Config.ARGB_8888);
        
    Canvas canvas = new Canvas(output);
    Paint paintColor = new Paint();
    paintColor.setFlags(Paint.ANTI_ALIAS_FLAG);
        
    RectF rectF = new RectF(new Rect(0, 0, widthLight, heightLight));
        
    canvas.drawRoundRect(rectF, widthLight / 2, heightLight / 2, paintColor);
        
    Paint paintImage = new Paint();
    paintImage.setXfermode(new PorterDuffXfermode(Mode.SRC_ATOP));
    canvas.drawBitmap(bitmap, 0, 0, paintImage);
        
    return output;
}

Thanks for this post. Helped me a lot ! – MahmutKarali Oct 07 '19 at 08:38 — MahmutKarali, Oct 07 '19 at 08:38

score 2 · Answer 2 · answered May 20 '14 at 13:39

Romain Guy, formerly an engineer on the Android team at Google, posted an excellent article on drawing images with rounded corners. This idea could be easily extended to a circle, for example, by changing the rounded rectangle radius so that it creates a complete circle.

From the article:

To generate the rounded images I simply wrote a custom Drawable that draws a rounded rectangle using Canvas.drawRoundRect(). The trick is to use a Paint with a BitmapShader to fill the rounded rectangle with a texture instead of a simple color. Here is what the code looks like:
BitmapShader shader; shader = new BitmapShader(bitmap,
Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);

Paint paint = new Paint(); paint.setAntiAlias(true);
paint.setShader(shader);

RectF rect = new RectF(0.0f, 0.0f, width, height);

// rect contains the bounds of the shape
// radius is the radius in pixels of the rounded corners
// paint contains the shader that will texture the shape
canvas.drawRoundRect(rect, radius, radius, paint);

Canvas also exposes a [drawCircle](http://developer.android.com/reference/android/graphics/Canvas.html) method which might be more appropriate for this case. — greg7gkb, Mar 12 '15 at 00:29

score 1 · Answer 3 · edited May 18 '15 at 05:46

Class:

  public Bitmap getRoundedShape(Bitmap scaleBitmapImage) {

    int targetWidth = 50;
    int targetHeight = 50;
    Bitmap targetBitmap = Bitmap.createBitmap(targetWidth, 
                        targetHeight,Bitmap.Config.ARGB_8888);
                        canvas = new Canvas(targetBitmap);
    Path path = new Path();
    path.addCircle(((float) targetWidth - 1) / 2,
    ((float) targetHeight - 1) / 2,
    (Math.min(((float) targetWidth), 
            ((float) targetHeight)) / 2),
      Path.Direction.CCW);

    canvas.clipPath(path);
    Bitmap sourceBitmap = scaleBitmapImage;
    canvas.drawBitmap(sourceBitmap, 
                            new Rect(0, 0, sourceBitmap.getWidth(),
      sourceBitmap.getHeight()), 
                            new Rect(0, 0, targetWidth,
      targetHeight), null);
    return targetBitmap;
   }

View:

<ImageView
        android:id="@+id/imgView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/btnEdit"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="40dp"
        android:background="@drawable/rounded"
        android:adjustViewBounds="true"
        android:gravity="center"
        android:src="@drawable/happy"/>

Additional styles:

 <?xml version="1.0" encoding="utf-8"?>
 <shape xmlns:android="http://schemas.android.com/apk/res/android" >

<solid android:color="@android:color/white" />

<stroke
    android:width="3dip"
    android:color="#FF0000" />

<corners android:radius="10dp" />

<padding
    android:bottom="0dp"
    android:left="0dp"
    android:right="0dp"
    android:top="0dp" />

score 1 · Answer 4 · answered Sep 03 '14 at 09:41

Wiseman Designs, have an open source Circular ImageView ready for use

https://github.com/wisemandesigns/CircularImageView

This uses XML in your layouts, which makes life easier. You can set the source in XML or with some minor modification could easily use a Bitmap.

Disclaimer: I work for Wiseman Designs

score 0 · Answer 5 · edited Mar 18 '14 at 07:01

Try with below code :

public Bitmap getRoundedShape(Bitmap scaleBitmapImage) {
  // TODO Auto-generated method stub
  int targetWidth = 50;
  int targetHeight = 50;
  Bitmap targetBitmap = Bitmap.createBitmap(targetWidth, 
                            targetHeight,Bitmap.Config.ARGB_8888);

                Canvas canvas = new Canvas(targetBitmap);
  Path path = new Path();
  path.addCircle(((float) targetWidth - 1) / 2,
  ((float) targetHeight - 1) / 2,
  (Math.min(((float) targetWidth), 
                ((float) targetHeight)) / 2),
          Path.Direction.CCW);

                canvas.clipPath(path);
  Bitmap sourceBitmap = scaleBitmapImage;
  canvas.drawBitmap(sourceBitmap, 
                                new Rect(0, 0, sourceBitmap.getWidth(),
    sourceBitmap.getHeight()), 
                                new Rect(0, 0, targetWidth,
    targetHeight), null);
  return targetBitmap;
 }

Not Working. Please suggest me. – Arun May 19 '14 at 06:01 — Arun, May 19 '14 at 06:01

score 0 · Answer 6 · edited Sep 03 '14 at 09:51

finalBitmapShader shader = newBitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
mPaint.setShader(shader);
mBitmapWidth=mBitmap.getWidth();
mBitmapHeight=mBitmap.getHeight();
}
@Override
public void draw(Canvas canvas{ 
  canvas.drawOval(mRectF,mPaint);
}
@Override
protected void onBoundsChange(Rect bounds) {
  super.onBoundsChange(bounds);
  mRectF.set(bounds);
}

here I found a sample tutorial of it at http://androidgreeve.blogspot.in/2014/09/facebook-messanger-like-profile-image.html?m=1

Crop Image as circle in Android

6 Answers6

Linked