Instantly share code, notes, and snippets.

What would you like to do?
How to obtain a CardView (support library) with a Image and rounded corners for API<21
ImageView imageView = (ImageView) findViewById(;
Bitmap mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.rose);
} else {
RoundCornersDrawable round = new RoundCornersDrawable(mBitmap,
getResources().getDimension(R.dimen.cardview_default_radius), 0); //or your custom radius
CardView cardView = (CardView) findViewById(;
cardView.setPreventCornerOverlap(false); //it is very important
* Image with rounded corners
* You can find the original source here:
* @author Gabriele Mariotti (
public class RoundCornersDrawable extends Drawable {
private final float mCornerRadius;
private final RectF mRect = new RectF();
//private final RectF mRectBottomR = new RectF();
//private final RectF mRectBottomL = new RectF();
private final BitmapShader mBitmapShader;
private final Paint mPaint;
private final int mMargin;
public RoundCornersDrawable(Bitmap bitmap, float cornerRadius, int margin) {
mCornerRadius = cornerRadius;
mBitmapShader = new BitmapShader(bitmap,
Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
mPaint = new Paint();
mMargin = margin;
protected void onBoundsChange(Rect bounds) {
mRect.set(mMargin, mMargin, bounds.width() - mMargin, bounds.height() - mMargin);
//mRectBottomR.set( (bounds.width() -mMargin) / 2, (bounds.height() -mMargin)/ 2,bounds.width() - mMargin, bounds.height() - mMargin);
// mRectBottomL.set( 0, (bounds.height() -mMargin) / 2, (bounds.width() -mMargin)/ 2, bounds.height() - mMargin);
public void draw(Canvas canvas) {
canvas.drawRoundRect(mRect, mCornerRadius, mCornerRadius, mPaint);
//canvas.drawRect(mRectBottomR, mPaint); //only bottom-right corner not rounded
//canvas.drawRect(mRectBottomL, mPaint); //only bottom-left corner not rounded
public int getOpacity() {
return PixelFormat.TRANSLUCENT;
public void setAlpha(int alpha) {
public void setColorFilter(ColorFilter cf) {

This comment has been minimized.

jplauber commented Nov 5, 2014

Thank you :) That works fine for me


This comment has been minimized.

prashantwosti commented Nov 13, 2014

Thanks for this. But what if I have image loaders such as picasso and UIL in an adapter and I have to make image round at its corner? a little snippet would be great.

Thanks again.


This comment has been minimized.

mheras commented Nov 21, 2014

+1 to @prashantwosti. I also need a way to use this with PIcasso within an adapter. Any idea on how to achieve it? Thanks!!!!


This comment has been minimized.

ndorigatti commented Jan 16, 2015

on picasso you can use Transformation to transform the bitmap after the download so you have to work on it a bit


This comment has been minimized.

vsahu1986 commented Jan 28, 2015



This comment has been minimized.

alamkanak commented Feb 12, 2015

It does not seem to behave correctly if I set scaleType of the ImageView to be centerCrop. Still zooms the image to the actual size.


This comment has been minimized.

ianmartorell commented Mar 8, 2015

This method sets the image as a background, and it looks like there is currently no way to centerCrop a background.


This comment has been minimized.

kaine987 commented May 3, 2015

Is this method supposed to also work to get rounded corners for the enclosed image?


This comment has been minimized.

shnapsi commented Jun 8, 2015

can you please share the "@style/card_thumbnail_image"?



This comment has been minimized.

cathirv commented Sep 17, 2015

Hi, this is just what I need, but I get out, because not wear a drawable, but is an image database, a string:

sport.get (position) .getImagen ()

Please help, I have several days with this problem. Thank you


This comment has been minimized.

wandering7man commented May 16, 2016

Thank you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment