Canvas drawCircle behind an existing image

Question

Please help me figure what I'm doing wrong. I have to draw a circle behind an image (given as bitmap) with a different color based on the app logic, I using the following code.

        Bitmap workingBitmap = Bitmap.createBitmap(bitmap);
        Bitmap mutableBitmap = workingBitmap.copy(Bitmap.Config.ARGB_8888, true);

        Canvas canvas = new Canvas(mutableBitmap);

        Paint paint = new Paint();
        paint.setAntiAlias(true);
        paint.setColor(Color.BLUE);
        paint.setStyle(Paint.Style.FILL_AND_STROKE);

        int horizontalPadding = (iconSize - drawingWidth) / 2;
        int verticalPadding = (iconSize - drawingHeight) / 2;

        canvas.drawCircle(120, 120, 100, paint);
        return mutableBitmap;

what I'm getting is a circle above the image, which just fully covers the image, how to tell the code that an image has an upper layer.

Thanks

score 1 · Accepted Answer · answered Sep 11 '17 at 08:49

In your code you use mutableBitmap as a canvas and draw circle over it. If you want to draw your image above circle you should draw it after drawing circle. Code:

    Bitmap workingBitmap = Bitmap.createBitmap(bitmap);
    Bitmap mutableBitmap = workingBitmap.copy(Bitmap.Config.ARGB_8888, true);
    // Create an empty bitmap
    Bitmap output = Bitmap.createBitmap(mutableBitmap.getWidth(), mutableBitmap.getHeight(), 
            mutableBitmap.getConfig());
    // Use empty bitmap as canvas
    Canvas canvas = new Canvas(output);

    Paint paint = new Paint();
    paint.setAntiAlias(true);
    paint.setColor(Color.BLUE);
    paint.setStyle(Paint.Style.FILL_AND_STROKE);

    int horizontalPadding = (iconSize - drawingWidth) / 2;
    int verticalPadding = (iconSize - drawingHeight) / 2;

    canvas.drawCircle(120, 120, 100, paint);
    // And now draw image above circle
    canvas.drawBitmap(mutableBitmap, 0, 0, null);
    return output;

Canvas drawCircle behind an existing image

1 Answers1