Android-使用画布在位图之外使用背景色设置图像叠加层 [英] Android - Set Image overlay with background color outside of bitmap using canvas

问题描述

我正在处理相机活动覆盖图"，我已经成功创建了矩形外部的不透明颜色(不透明黑色).而且我还成功地在大矩形内创建了一个小矩形.请看下面的图片.如您所见，小矩形上面有蓝色背景.问题是，我想使图像(位图)外的蓝色背景不覆盖图像.问题是，如果我用透明填充更改图像，则蓝色背景将覆盖所有图像.如何使蓝色背景仅覆盖图像的外部?我已经尝试过从Google找到所有可能的答案，但是对我来说不走运，也许我是从错误的方法入手，需要建议.

I was working on a Camera Activity Overlay, I've successfully created opaque color outside of the rectangle (opaque black). And also I've successfully created a small rectangle inside the big rectangle. Please see below picture. As you can see , the small rectangle has a blue background on it. The problem is, I want to make the blue background outside the image (bitmap), not covering the image. The problem is, if I change the image with transparent fill, the blue background will cover it all. How can I make the blue background only cover the outside of the image? I already tried to find all possible answers from google, but no luck for me, maybe I started with wrong approach, need advice.

这是我的代码

bitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
    Canvas osCanvas = new Canvas(bitmap);

    RectF outerRectangle = new RectF(0, 0, getWidth(), getHeight());

    Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
    paint.setColor(getResources().getColor(R.color.opaque_black));
    paint.setAlpha(99);
    osCanvas.drawRect(outerRectangle, paint);


    paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT));

    paint.setColor(Color.TRANSPARENT);
    paint.setStyle(Paint.Style.FILL);
    RectF r1 = new RectF(
            (float) (xStartingPoint),
            (float) (yStartingPoint),
            (float) (parentWidth),
            (float) (parentHeight));

    osCanvas.drawRoundRect(r1, (float) (cornerRadiusRatio * parentHeight),
            (float) (cornerRadiusRatio * parentHeight), paint);

    paint.setStrokeWidth(strokeWidth);
    paint.setColor(getResources().getColor(R.color.colorDeepSky));
    paint.setStyle(Paint.Style.STROKE);

    RectF r2 = new RectF(
            (float) (xStartingPoint),
            (float) (yStartingPoint),
            (float) (parentWidth),
            (float) (parentHeight));

    osCanvas.drawRoundRect(r2, (float) (cornerRadiusRatio * parentHeight),
            (float) (cornerRadiusRatio * parentHeight), paint);

    if (callbackMsg.equals(AppConstant.KTP_SELF)) {
        paint.setColor(getResources().getColor(R.color.colorDeepSky));

        drawRect(osCanvas, paint,
                (float) (xChildStartingPoint),
                (float) (yChildStartingPoint),
                (float) (childWidth + xChildStartingPoint + 0.3 * childWidth),
                (float) (childHeight + 0.7 * yChildStartingPoint));
    }

    RectF outerRectangle2 = new RectF(
    (float) xChildStartingPoint,
    (float) yChildStartingPoint,
    (float) (childWidth + xChildStartingPoint + 0.3 * childWidth),
    (float) (childHeight + 0.7 * yChildStartingPoint));

    Paint paint2 = new Paint(Paint.ANTI_ALIAS_FLAG);
    paint2.setColor(getResources().getColor(R.color.blue));
    paint2.setAlpha(99);
    osCanvas.drawRect(outerRectangle2, paint2);

    Rect r3 = new Rect(
            (int) (xChildStartingPoint),
            (int) (yChildStartingPoint),
            (int) (childWidth + xChildStartingPoint + 0.3 * childWidth),
            (int) (childHeight + 0.7 * yChildStartingPoint));

    paint2 = new Paint(Paint.ANTI_ALIAS_FLAG);
    paint2.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT));
    paint2.setColor(Color.TRANSPARENT);
    paint2.setStyle(Paint.Style.FILL);
    Bitmap mbitmap = BitmapFactory.decodeResource(getResources(),R.drawable.icon_profile2);
    osCanvas.drawBitmap(mbitmap, null, r3, paint2);

谢谢

推荐答案

好的，找到答案了

我在 DST_OUT 模式下使用 PorterDuff

注意:如果要使图像背景透明并且外部区域填充颜色，请使用DST_OUT如果要使外部区域充满颜色，请使用DST_IN

Note: Use DST_OUT if you want to make the image background transparent and the outside area filled with color Use DST_IN if you want to make the outside area filled with color

这是代码，我正在使用Kotlin

Here's the code, im using Kotlin

    var paint2 = Paint(Paint.ANTI_ALIAS_FLAG)
        paint2.color = resources.getColor(R.color.opaque_black)
        osCanvas.drawRect(outerRectangle2, paint2)

        paint2 = Paint(Paint.ANTI_ALIAS_FLAG)
        val r3 = Rect(
                xChildStartingPoint.toInt(),
                yChildStartingPoint.toInt(),
                (childWidth + xChildStartingPoint + 0.3 * childWidth).toInt(),
                (childHeight + 0.7 * yChildStartingPoint).toInt())

        paint2.xfermode = PorterDuffXfermode(PorterDuff.Mode.DST_IN)
        val mBitmap = BitmapFactory.decodeResource(resources, R.drawable.selfie_outline)
        osCanvas.drawBitmap(mBitmap, null, r3, paint2)

这篇关于Android-使用画布在位图之外使用背景色设置图像叠加层的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！