Madhav
Madhav

Reputation: 283

Making touched area of bitmap to transparent

I have 2 bitmaps on a canvas. ontouching the top bitmap , the lower bitmap should be visible and the top bitmap should be erased. I took help from this thread. Make certain area of bitmap transparent on touch. I can see the bottom bitmap through the circle, but the top bitmap is not erasing on touching. How to erase the the bitmap on touching. I know that this question has been asked before, but i am not able to solve the problem.

this is my code:

public class MainActivity extends Activity {

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(new Panel(this));
}

class Panel extends View {
    Bitmap bmOverlay;
    private Paint mPaint;
    Bitmap bm2, bm1;
    Bitmap bitmap;
    Canvas pcanvas;

    int x = 0;
    int y = 0;
    int r = 0;

    public Panel(Context context) {
        super(context);
        setFocusable(true);
        setBackgroundColor(Color.TRANSPARENT);

        // setting paint
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPaint.setColor(Color.TRANSPARENT);
        mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT));
        mPaint.setAntiAlias(true);

        bm1 = BitmapFactory.decodeResource(getResources(), R.drawable.aa);
        bm2 = BitmapFactory.decodeResource(getResources(), R.drawable.aaa);

        bmOverlay = Bitmap.createBitmap(bm1.getWidth(), bm1.getHeight(),
                Bitmap.Config.ARGB_8888);
        pcanvas = new Canvas(bmOverlay);

    }

    @Override
    protected void onDraw(Canvas canvas) {
        // draw a circle that is erasing bitmap
        super.onDraw(canvas);
        canvas.drawBitmap(bm2, 0, 0, null);
        pcanvas.drawBitmap(bm1, 0, 0, null);
        pcanvas.drawCircle(x, y, 40, mPaint);
        canvas.drawBitmap(bmOverlay, 0, 0, null);

    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        // set parameter to draw circle on touch event

        switch (ev.getAction()) {

        case MotionEvent.ACTION_DOWN: {

            x = (int) ev.getX();
            y = (int) ev.getY();
            invalidate();

            break;
        }

        case MotionEvent.ACTION_MOVE: {

            x = (int) ev.getX();
            y = (int) ev.getY();
            invalidate();
            break;

        }

        case MotionEvent.ACTION_UP:

            break;

        }
        return true;
    }



}
}

Upvotes: 0

Views: 286

Answers (1)

samgak
samgak

Reputation: 24427

You need to make two changes to get the top bitmap to erase. First, make it a mutable Bitmap so that you can change the contents as it is erased:

Bitmap temp = BitmapFactory.decodeResource(getResources(), R.drawable.aa);
bm1 = temp.copy(Bitmap.Config.ARGB_8888, true); // mutable = true

Be careful about out of memory errors here.

Secondly, in your onDraw function, update the bitmap contents by writing back to bm1:

@Override
protected void onDraw(Canvas canvas) {
    // draw a circle that is erasing bitmap
    super.onDraw(canvas);
    canvas.drawBitmap(bm2, 0, 0, null);
    pcanvas.drawBitmap(bm1, 0, 0, null);
    pcanvas.drawCircle(x, y, 40, mPaint);
    canvas.drawBitmap(bmOverlay, 0, 0, null);

    // erase the top bitmap:
    Canvas bitmapCanvas = new Canvas(bm1);
    bitmapCanvas.drawBitmap(bm2, 0, 0, null);
    bitmapCanvas.drawBitmap(bmOverlay, 0, 0, null);
}

Also, to stop a circle being erased in the top left corner when you start the app, create a boolean with a default value of false and set it inside onTouchEvent when you have valid co-ordinates, and check it before calling drawCircle.

Upvotes: 1

Related Questions