Rounded Rectangle Shape To Image Retrieving From Server In Android

I want to give rounded rectangle shape to the images that I am fetching them from the server and displaying in list view. Currently I am able to make the images in a rounded recta

Solution 1:

Round corners to view, simply create xml for drawable, apply Radius rate to your image corner as well as you can apply background color to your view too, check below code and steps.

Create one folder named Drawable within Res, keep below xml in drawable and you can set at runtime or in layout xml to your view.

round_border.xml

<?xml version="1.0" encoding="UTF-8"?><shapexmlns:android="http://schemas.android.com/apk/res/android"><solidandroid:color="#5a5a5a"/><cornersandroid:radius="10px"/><paddingandroid:left="20dp"android:top="20dp"android:right="20dp"android:bottom="20dp"/></shape>

Within xml

 android:background="@drawable/round_border"

Jave code

ImageView im=(ImageView)findViewById(R.id.imageView2);
    im.setBackgroundResource(R.drawable.round_border);

Solution 2:

Try this

int radius=5;
int margin=5;

Picasso.with(context)
    .load(imageurl)
    .transform(new RoundedCornersTransformation(radius,margin))
    .into(imageview);

RoundedCornersTransformation.java

publicclassRoundedCornersTransformationimplementsTransformation {

    publicenumCornerType {
        ALL,
        TOP_LEFT, TOP_RIGHT, BOTTOM_LEFT, BOTTOM_RIGHT,
        TOP, BOTTOM, LEFT, RIGHT,
        OTHER_TOP_LEFT, OTHER_TOP_RIGHT, OTHER_BOTTOM_LEFT, OTHER_BOTTOM_RIGHT,
        DIAGONAL_FROM_TOP_LEFT, DIAGONAL_FROM_TOP_RIGHT
    }

    privateint mRadius;
    privateint mDiameter;
    privateint mMargin;
    private CornerType mCornerType;

    publicRoundedCornersTransformation(int radius, int margin) {
        this(radius, margin, CornerType.ALL);
    }

    publicRoundedCornersTransformation(int radius, int margin, CornerType cornerType) {
        mRadius = radius;
        mDiameter = radius * 2;
        mMargin = margin;
        mCornerType = cornerType;
    }

    @Overridepublic Bitmap transform(Bitmap source) {

        intwidth= source.getWidth();
        intheight= source.getHeight();

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

        Canvascanvas=newCanvas(bitmap);
        Paintpaint=newPaint();
        paint.setAntiAlias(true);
        paint.setShader(newBitmapShader(source, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP));
        drawRoundRect(canvas, paint, width, height);
        source.recycle();

        return bitmap;
    }

    privatevoiddrawRoundRect(Canvas canvas, Paint paint, float width, float height) {
        floatright= width - mMargin;
        floatbottom= height - mMargin;

        switch (mCornerType) {
            case ALL:
                canvas.drawRoundRect(newRectF(mMargin, mMargin, right, bottom), mRadius, mRadius, paint);
                break;
            case TOP_LEFT:
                drawTopLeftRoundRect(canvas, paint, right, bottom);
                break;
            case TOP_RIGHT:
                drawTopRightRoundRect(canvas, paint, right, bottom);
                break;
            case BOTTOM_LEFT:
                drawBottomLeftRoundRect(canvas, paint, right, bottom);
                break;
            case BOTTOM_RIGHT:
                drawBottomRightRoundRect(canvas, paint, right, bottom);
                break;
            case TOP:
                drawTopRoundRect(canvas, paint, right, bottom);
                break;
            case BOTTOM:
                drawBottomRoundRect(canvas, paint, right, bottom);
                break;
            case LEFT:
                drawLeftRoundRect(canvas, paint, right, bottom);
                break;
            case RIGHT:
                drawRightRoundRect(canvas, paint, right, bottom);
                break;
            case OTHER_TOP_LEFT:
                drawOtherTopLeftRoundRect(canvas, paint, right, bottom);
                break;
            case OTHER_TOP_RIGHT:
                drawOtherTopRightRoundRect(canvas, paint, right, bottom);
                break;
            case OTHER_BOTTOM_LEFT:
                drawOtherBottomLeftRoundRect(canvas, paint, right, bottom);
                break;
            case OTHER_BOTTOM_RIGHT:
                drawOtherBottomRightRoundRect(canvas, paint, right, bottom);
                break;
            case DIAGONAL_FROM_TOP_LEFT:
                drawDiagonalFromTopLeftRoundRect(canvas, paint, right, bottom);
                break;
            case DIAGONAL_FROM_TOP_RIGHT:
                drawDiagonalFromTopRightRoundRect(canvas, paint, right, bottom);
                break;
            default:
                canvas.drawRoundRect(newRectF(mMargin, mMargin, right, bottom), mRadius, mRadius, paint);
                break;
        }
    }

    privatevoiddrawTopLeftRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(mMargin, mMargin, mMargin + mDiameter, mMargin + mDiameter),
                mRadius, mRadius, paint);
        canvas.drawRect(newRectF(mMargin, mMargin + mRadius, mMargin + mRadius, bottom), paint);
        canvas.drawRect(newRectF(mMargin + mRadius, mMargin, right, bottom), paint);
    }

    privatevoiddrawTopRightRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(right - mDiameter, mMargin, right, mMargin + mDiameter), mRadius,
                mRadius, paint);
        canvas.drawRect(newRectF(mMargin, mMargin, right - mRadius, bottom), paint);
        canvas.drawRect(newRectF(right - mRadius, mMargin + mRadius, right, bottom), paint);
    }

    privatevoiddrawBottomLeftRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(mMargin, bottom - mDiameter, mMargin + mDiameter, bottom),
                mRadius, mRadius, paint);
        canvas.drawRect(newRectF(mMargin, mMargin, mMargin + mDiameter, bottom - mRadius), paint);
        canvas.drawRect(newRectF(mMargin + mRadius, mMargin, right, bottom), paint);
    }

    privatevoiddrawBottomRightRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(right - mDiameter, bottom - mDiameter, right, bottom), mRadius,
                mRadius, paint);
        canvas.drawRect(newRectF(mMargin, mMargin, right - mRadius, bottom), paint);
        canvas.drawRect(newRectF(right - mRadius, mMargin, right, bottom - mRadius), paint);
    }

    privatevoiddrawTopRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(mMargin, mMargin, right, mMargin + mDiameter), mRadius, mRadius,
                paint);
        canvas.drawRect(newRectF(mMargin, mMargin + mRadius, right, bottom), paint);
    }

    privatevoiddrawBottomRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(mMargin, bottom - mDiameter, right, bottom), mRadius, mRadius,
                paint);
        canvas.drawRect(newRectF(mMargin, mMargin, right, bottom - mRadius), paint);
    }

    privatevoiddrawLeftRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(mMargin, mMargin, mMargin + mDiameter, bottom), mRadius, mRadius,
                paint);
        canvas.drawRect(newRectF(mMargin + mRadius, mMargin, right, bottom), paint);
    }

    privatevoiddrawRightRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(right - mDiameter, mMargin, right, bottom), mRadius, mRadius,
                paint);
        canvas.drawRect(newRectF(mMargin, mMargin, right - mRadius, bottom), paint);
    }

    privatevoiddrawOtherTopLeftRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(mMargin, bottom - mDiameter, right, bottom), mRadius, mRadius,
                paint);
        canvas.drawRoundRect(newRectF(right - mDiameter, mMargin, right, bottom), mRadius, mRadius,
                paint);
        canvas.drawRect(newRectF(mMargin, mMargin, right - mRadius, bottom - mRadius), paint);
    }

    privatevoiddrawOtherTopRightRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(mMargin, mMargin, mMargin + mDiameter, bottom), mRadius, mRadius,
                paint);
        canvas.drawRoundRect(newRectF(mMargin, bottom - mDiameter, right, bottom), mRadius, mRadius,
                paint);
        canvas.drawRect(newRectF(mMargin + mRadius, mMargin, right, bottom - mRadius), paint);
    }

    privatevoiddrawOtherBottomLeftRoundRect(Canvas canvas, Paint paint, float right, float bottom) {
        canvas.drawRoundRect(newRectF(mMargin, mMargin, right, mMargin + mDiameter), mRadius, mRadius,
                paint);
        canvas.drawRoundRect(newRectF(right - mDiameter, mMargin, right, bottom), mRadius, mRadius,
                paint);
        canvas.drawRect(newRectF(mMargin, mMargin + mRadius, right - mRadius, bottom), paint);
    }

    privatevoiddrawOtherBottomRightRoundRect(Canvas canvas, Paint paint, float right,
                                               float bottom) {
        canvas.drawRoundRect(newRectF(mMargin, mMargin, right, mMargin + mDiameter), mRadius, mRadius,
                paint);
        canvas.drawRoundRect(newRectF(mMargin, mMargin, mMargin + mDiameter, bottom), mRadius, mRadius,
                paint);
        canvas.drawRect(newRectF(mMargin + mRadius, mMargin + mRadius, right, bottom), paint);
    }

    privatevoiddrawDiagonalFromTopLeftRoundRect(Canvas canvas, Paint paint, float right,
                                                  float bottom) {
        canvas.drawRoundRect(newRectF(mMargin, mMargin, mMargin + mDiameter, mMargin + mDiameter),
                mRadius, mRadius, paint);
        canvas.drawRoundRect(newRectF(right - mDiameter, bottom - mDiameter, right, bottom), mRadius,
                mRadius, paint);
        canvas.drawRect(newRectF(mMargin, mMargin + mRadius, right - mDiameter, bottom), paint);
        canvas.drawRect(newRectF(mMargin + mDiameter, mMargin, right, bottom - mRadius), paint);
    }

    privatevoiddrawDiagonalFromTopRightRoundRect(Canvas canvas, Paint paint, float right,
                                                   float bottom) {
        canvas.drawRoundRect(newRectF(right - mDiameter, mMargin, right, mMargin + mDiameter), mRadius,
                mRadius, paint);
        canvas.drawRoundRect(newRectF(mMargin, bottom - mDiameter, mMargin + mDiameter, bottom),
                mRadius, mRadius, paint);
        canvas.drawRect(newRectF(mMargin, mMargin, right - mRadius, bottom - mRadius), paint);
        canvas.drawRect(newRectF(mMargin + mRadius, mMargin + mRadius, right, bottom), paint);
    }

    @Overridepublic String key() {
        return"RoundedTransformation(radius=" + mRadius + ", margin=" + mMargin + ", diameter="
                + mDiameter + ", cornerType=" + mCornerType.name() + ")";
    }
}