Android中带有圆角的自定义视图

Question

I have a custom view which contains several layers of images, layouts with texts, drawings etc. I want to make one of the corners of the view round (top-right corner). In other words, I want to crop this corner to make it round - not to set rounded corner background.

I managed to do it by using clipPath() , but it's running slow since I had to turn the hardware acceleration for this view - so this solution is not suited for me.

Any other way to do that?

Answer 1

Here is the custom rounded ImageView class extending ImageView. And here variable CORNER_RADIUS is the value of radius. Using this code you can create any rounded view just by extending that class from that view.

public class RoundedImage extends android.support.v7.widget.AppCompatImageView
 {
private final static float CORNER_RADIUS = 100.0f;

private Bitmap maskBitmap;
private Paint paint, maskPaint;
private float cornerRadius;

public RoundedImage(Context context) {
    super(context);
    init(context, null, 0);

}

public RoundedImage(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(context, attrs, 0);
}

public RoundedImage(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    init(context, attrs, defStyle);
}

private void init(Context context, AttributeSet attrs, int defStyle) {
    DisplayMetrics metrics = context.getResources().getDisplayMetrics();
    cornerRadius = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, CORNER_RADIUS, metrics);

    paint = new Paint(Paint.ANTI_ALIAS_FLAG);

    maskPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.FILTER_BITMAP_FLAG);
    maskPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));

    setWillNotDraw(false);
}

@Override
public void draw(Canvas canvas) {
    Bitmap offscreenBitmap = Bitmap.createBitmap(canvas.getWidth(), canvas.getHeight(), Bitmap.Config.ARGB_8888);
    Canvas offscreenCanvas = new Canvas(offscreenBitmap);

    super.draw(offscreenCanvas);

    if (maskBitmap == null) {
        maskBitmap = createMask(canvas.getWidth(), canvas.getHeight());
    }

    offscreenCanvas.drawBitmap(maskBitmap, 0f, 0f, maskPaint);
    canvas.drawBitmap(offscreenBitmap, 0f, 0f, paint);
}

private Bitmap createMask(int width, int height) {
    Bitmap mask = Bitmap.createBitmap(width, height, Bitmap.Config.ALPHA_8);
    Canvas canvas = new Canvas(mask);

    Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
    paint.setColor(Color.WHITE);

    canvas.drawRect(0, 0, width, height, paint);

    paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
    canvas.drawRoundRect(new RectF(0, 0, width, height), cornerRadius, cornerRadius, paint);

    return mask;
}

}

How to use is:

<com.packagename.RoundedImage
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:scaleType="centercrop"
 />

Answer 2

This should not be a problem if you create a transparent canvas for that custom view. Then draw a rounded rectangle on it as a background before the rest of the graphics.

The rounded rectangle should be bigger than the canvas and shifted to the left so that the top-right corner of the canvas stays transparent.

However is you draw biger images in your custom view and want just to clip that corner than you can just erase that corner with a corner shape Path filled with a paint

mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));