Skip to content

Instantly share code, notes, and snippets.

@JoaquimLey
Created August 17, 2016 21:55
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save JoaquimLey/ec891bfb342798726716c6a6360e1304 to your computer and use it in GitHub Desktop.
Save JoaquimLey/ec891bfb342798726716c6a6360e1304 to your computer and use it in GitHub Desktop.
Transform an ImageView into circular shape, works with Picasso

Using Picasso with a circular ImageView

With this helper class you can transform your ordinary ImageView into ciruclar shape using Picasso library.

###Include this class into your project:

package com.<YOUR-PACKAGE-NAME>
	
import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.Paint;
	
import com.squareup.picasso.Transformation;
	
/**
* Transform an ImageView into Circular shape
*/
public class ImageCircleTransformation implements Transformation {
	@Override
	public Bitmap transform(Bitmap source) {
		int size = Math.min(source.getWidth(), source.getHeight());
		int x = (source.getWidth() - size) / 2;
		int y = (source.getHeight() - size) / 2;
		
		Bitmap squaredBitmap = Bitmap.createBitmap(source, x, y, size, size);
		if (squaredBitmap != source) {
		    source.recycle();
		}
		
		Bitmap bitmap = Bitmap.createBitmap(size, size, source.getConfig());
		
		Canvas canvas = new Canvas(bitmap);
		Paint paint = new Paint();
		BitmapShader shader = new BitmapShader(squaredBitmap, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP);
		paint.setShader(shader);
		paint.setAntiAlias(true);
		
		float r = size/2f;
		canvas.drawCircle(r, r, r, paint);
		
		squaredBitmap.recycle();
		return bitmap;
	}

	@Override
	public String key() {
	return ImageCircleTransformation.class.getSimpleName();
	}
}

Usage example

Picasso.with(context)
       .load(imageUrl)
       .transform(new ImageCircleTransformation())
       .into(yourRegularImageView);
package com.<YOUR-PACKAGE-NAME>;
import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.Paint;
import com.squareup.picasso.Transformation;
/**
* Transform an ImageView into Circular shape with Picasso
*/
public class ImageCircleTransformation implements Transformation {
@Override
public Bitmap transform(Bitmap source) {
int size = Math.min(source.getWidth(), source.getHeight());
int x = (source.getWidth() - size) / 2;
int y = (source.getHeight() - size) / 2;
Bitmap squaredBitmap = Bitmap.createBitmap(source, x, y, size, size);
if (squaredBitmap != source) {
source.recycle();
}
Bitmap bitmap = Bitmap.createBitmap(size, size, source.getConfig());
Canvas canvas = new Canvas(bitmap);
Paint paint = new Paint();
BitmapShader shader = new BitmapShader(squaredBitmap, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP);
paint.setShader(shader);
paint.setAntiAlias(true);
float r = size/2f;
canvas.drawCircle(r, r, r, paint);
squaredBitmap.recycle();
return bitmap;
}
@Override
public String key() {
return ImageCircleTransformation.class.getSimpleName();
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment