Erasing part of bitmap shows black background instead of image

Question

Hi guys, I'm trying to overlap 2 images on top of each other and when you touch the image on top, it should be made transparent on that touched radius, thus exposing the bottom image.

The problem I'm having is, the bitmap on top isn't transparent, or rather the canvas has a black background. Because when you touch the image on top, it reveals a black background instead of the image on the bottom.

Strange thing is, it works fine if the bitmap on top is a color and doesn't have a resource in it.

Here's my code:

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
                WindowManager.LayoutParams.FLAG_FULLSCREEN);
        setContentView(new DrawView(this));
    }

    public class DrawView extends View implements OnTouchListener {

        private int x = 0;
        private int y = 0;

        Bitmap bitmap;
        Bitmap bitmap2;
        Canvas bitmapCanvas;

        Drawable d;

        private final Paint paint = new Paint();
        private final Paint eraserPaint = new Paint();

        public DrawView(Context context) {
            super(context);
            setFocusable(true);
            setFocusableInTouchMode(true);

            this.setOnTouchListener(this);

            // Set background
            this.setBackgroundResource(R.drawable.pictureBottom);

            // Set bitmap
            bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.pictureTop).copy(Bitmap.Config.ARGB_8888, true);

            // It works if you create a bitmap with a background color instead of a resource
            //bitmap = Bitmap.createBitmap(600, 900, Bitmap.Config.ARGB_8888);

            bitmapCanvas = new Canvas();
            bitmapCanvas.setBitmap(bitmap);
            bitmapCanvas.drawColor(Color.TRANSPARENT);

            // Set eraser paint properties
            eraserPaint.setColor(Color.TRANSPARENT);
            eraserPaint.setAlpha(0);
            eraserPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
            eraserPaint.setAntiAlias(true);
        }

        @Override
        public void onDraw(Canvas canvas) {         
            canvas.drawColor(Color.TRANSPARENT);
            bitmapCanvas.drawColor(Color.TRANSPARENT);
            bitmapCanvas.drawCircle(x, y, 40, eraserPaint);

            canvas.drawBitmap(bitmap, 0, 0, paint);
        }

        public boolean onTouch(View view, MotionEvent event) {
            x = (int) event.getX();
            y = (int) event.getY();

            invalidate();
            return true;
        }

    }```

Welcome to the Treehouse Community

Looking to learn something new?

yilzer

yilzer

Erasing part of bitmap shows black background instead of image

Aurelian Spodarec

Aurelian Spodarec