Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ImageView with rounded corners after scaling with ScaleType.CenterCrop

I am trying to crop an image and then round the corners so that it appears more nicely on the screen.

What I've been able to do is round the corners of the image, but the cropping will sometimes cut off the sides of the image (depending on the size/aspect ratio of the image).

So what I would like to do is perform the crop, THEN apply the rounded corners. How can I do this?

Rounding the corners of the image:

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

    final int color = 0xff000000;
    final Paint paint = new Paint();
    final Rect rect = new Rect(0,0,bitmap.getWidth(), bitmap.getHeight());
    final RectF rectF = new RectF(rect);
    final float roundpx = 20;

    paint.setAntiAlias(true);
    canvas.drawARGB(0, 0, 0, 0);
    paint.setColor(color);
    canvas.drawRoundRect(rectF, roundpx, roundpx, paint);

    paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
    canvas.drawBitmap(bitmap, rect, rect, paint);

    return output;
}

And then I set the imageview's scaletype like so: imageView.setScaleType(ScaleType.CENTER_CROP)

like image 552
h_k Avatar asked Sep 26 '14 19:09

h_k


People also ask

How do I make rounded corners in paint?

In the upper left corner, select “Draw Filled Shape“. Draw the rounded rectangle over the area you would like to keep for your rounded corners image. Use the Magic Wand to select the area of the rounded rectangle. Select “Edit” > “Invert Selection“.

What is adjustViewBounds?

android:adjustViewBounds—If set to true, the attribute adjusts the bounds of the ImageView control to maintain the aspect ratio of the image displayed through it. android:resizeMode—The resizeMode attribute is used to make a control resizable so we can resize it horizontally, vertically, or around both axes.


1 Answers

if you wrap your imageview with cardview, you achieve.

<android.support.v7.widget.CardView 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    card_view:cardCornerRadius="4dp"
    card_view:cardElevation="4dp"
    card_view:cardUseCompatPadding="true">
        <ImageView
            android:id="@+id/ivImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/your_image" />
</android.support.v7.widget.CardView>
like image 197
msevgi Avatar answered Sep 30 '22 18:09

msevgi