Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android Mask bitmap on canvas gen a black space

I have a mask bitmap with a half is red color and ones is transparent like this https://www.dropbox.com/s/931ixef6myzusi0/s_2.png

I want to use mask bitmap to draw content on canvas only visible in red area, code like this:

Paint paint = new Paint();


public void draw(Canvas canvas) {
// draw content here
  ...

//and mask bitmap here
  paint.setXfermode(new PorterDuffXfermode(android.graphics.PorterDuff.Mode.DST_IN));
  canvas.drawBitmap(maskBitmap, 0, 0, paint);

}

The result as my expecting (content only visible in red area, BUT THE TRANSPARENT AREA BECOME BLACK IS PROBLEM!)

this image result :https://www.dropbox.com/s/mqj48992wllfkiq/s_2%20copy.png Anyone help me???

like image 815
Thomc Avatar asked May 31 '14 04:05

Thomc


2 Answers

Here is a solution which helped me to implement masking:

public void draw(Canvas canvas) {
        Bitmap original = BitmapFactory.decodeResource(getContext().getResources(),R.drawable.original_image);
        Bitmap mask = BitmapFactory.decodeResource(getContext().getResources(),R.drawable.mask_image);

        //You can change original image here and draw anything you want to be masked on it.

        Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(), Config.ARGB_8888);
        Canvas tempCanvas = new Canvas(result);
        Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));
        tempCanvas.drawBitmap(original, 0, 0, null);
        tempCanvas.drawBitmap(mask, 0, 0, paint);
        paint.setXfermode(null);

        //Draw result after performing masking
        canvas.drawBitmap(result, 0, 0, new Paint());
}

The mask should be a white image with transparency.
It will work like this:
original image + mask = result image

like image 51
Sergey Pekar Avatar answered Nov 16 '22 08:11

Sergey Pekar


I encountered the same problem in my custom view and instead of decoding the bitmap from a resource, I had created the original bitmap and the masking bitmap from the scratch via canvas.draw*() methods (since both the original and mask are basic shapes). I was getting the blank opaque space instead of a transparent one. I fixed it by setting a hardware layer to my view.

View.setLayerType(LAYER_TYPE_HARDWARE, paint);

More info on why this is to be done here: https://stackoverflow.com/a/33483016/4747587

like image 7
Henry Avatar answered Nov 16 '22 09:11

Henry