1

I want to crop a circle shape image from my original one. I'm using Picasso library for image displaying. Tried http://yasiradnan.com/circle-transformation-with-android-image-downloading-and-caching-library-picasso/ , but It's just tranforming full image into a circle one, so image became deformed. I don't want to transform image, I want just to crop image with circle shape.

StupidFox
  • 376
  • 3
  • 19
  • I don't know how to use Picasso, but this might help you: http://stackoverflow.com/questions/12944275/crop-image-as-circle-in-android – raybaybay Jun 18 '14 at 21:39

3 Answers3

4

To accomplish what you're trying to do, you could subclass ImageView and make it implement Picasso's Target interface. When the bitmap is loaded, just use a method that centercrops the bitmap into a square, and then shades the image into a circular shape. For example:

public class ImageViewTarget extends ImageView implements Target {

    //constructors

@Override
public void onBitmapFailed(Drawable drawable) {
         //TODO
}

@Override
public void onBitmapLoaded(Bitmap bitmap, LoadedFrom loadFrom) {
       bitmap = cropCircle(bitmap.isMutable() ? bitmap : bitmap.copy(Config.ARGB_8888, true));
           setImageBitmap(bitmap);
}

@Override
public void onPrepareLoad(Drawable arg0) {
     //TODO
}


public Bitmap cropCricle(Bitmap bm){

    int width = bm.getWidth();
    int height = bm.getHeight();

    Bitmap cropped_bitmap;

    /* Crop the bitmap so it'll display well as a circle. */
    if (width > height) {
        cropped_bitmap = Bitmap.createBitmap(bm,
                (width / 2) - (height / 2), 0, height, height);
    } else {
        cropped_bitmap = Bitmap.createBitmap(bm, 0, (height / 2)
                - (width / 2), width, width);
    }

    BitmapShader shader = new BitmapShader(cropped_bitmap, TileMode.CLAMP, TileMode.CLAMP);

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

    height = cropped_bitmap.getHeight();
    width = cropped_bitmap.getWidth();

    Bitmap mCanvasBitmap = Bitmap.createBitmap(width, height,
            Bitmap.Config.ARGB_8888);

    Canvas canvas = new Canvas(mCanvasBitmap);
    canvas.drawCircle(width/2, height/2, width/2, paint);

    return mCanvasBitmap;
}

}

There might be a better why to handle the cropCircle(Bitmap bitmap); method, but the above works as sometime to optimize/build off of.

Submersed
  • 8,810
  • 2
  • 30
  • 38
2

You may use the following code for getting Rounded Bitmap... That may be Helpful to You ....

   private Bitmap getRoundedCroppedImage(Bitmap bmp) {
        int widthLight = bmp.getWidth();
        int heightLight = bmp.getHeight();

        Bitmap output = Bitmap.createBitmap(widthLight, heightLight,Config.ARGB_8888);

        Canvas canvas = new Canvas(output);
        Paint paint = new Paint();
        paint.setFlags(Paint.ANTI_ALIAS_FLAG);

        RectF rectF = new RectF(new Rect(0, 0, widthLight, heightLight));

        canvas.drawRoundRect(rectF, widthLight / 2 ,heightLight / 2,paint);

        Paint paintImage = new Paint();
        paintImage.setXfermode(new PorterDuffXfermode(Mode.SRC_ATOP));
        canvas.drawBitmap(bmp, 0, 0, paintImage);

        return output;
    }

Thanks...

0

There is some decision that I made based on that answer You can make Custom ImageView with no libs

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
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 CircleImageView extends ImageView {

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

    @Override
    public void setImageDrawable(Drawable aDrawable) {
        Bitmap bitmap=getCircleCroppedBitmap(((BitmapDrawable) aDrawable).getBitmap());
        super.setImageDrawable(new BitmapDrawable(getResources(),bitmap));
    }

    private static Bitmap getCircleCroppedBitmap(Bitmap bitmap) {
        Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),
                bitmap.getHeight(), Config.ARGB_8888);
        Canvas canvas = new Canvas(output);

        final int color = 0xff424242;
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());

        paint.setAntiAlias(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(color);
        // canvas.drawRoundRect(rectF, roundPx, roundPx, paint);
        canvas.drawCircle(bitmap.getWidth() / 2, bitmap.getHeight() / 2,
                bitmap.getWidth() / 2, paint);
        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        canvas.drawBitmap(bitmap, rect, rect, paint);
        //Bitmap _bmp = Bitmap.createScaledBitmap(output, 60, 60, false);
        //return _bmp;
        return output;
    }

}
Community
  • 1
  • 1
George
  • 26
  • 7