How to delete shapes drawn on an Image

Question

I am developing a small Paint tool. And I am able to load and draw Lines or Circles and other shapes on an image. Also I have an eraser tool to erase the shapes that I have drawn.
This is code for that:

g.setColor(getColor().WHITE);
g.fillRect(getXAxis() - getThickness(), getYAxis() - getThickness(), getThickness() * 2, getThickness() * 2);

My problem is that, If I have loaded an image and drawn some shapes on it. Then when I tried to erase the shapes, the image is also gets replaced with white color.
Is there any way to set the image as the background while using fillRect() to erase the shape, so that my image will be untouched.

Answer 1

Here is the example. To test it you need to replace my image with your background image.

import java.awt.AlphaComposite;
import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Image;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.image.BufferedImage;
import java.io.File;

import javax.imageio.ImageIO;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.WindowConstants;

/**
 * <code>PaintTryout</code>.
 *
 * @author smedvynskyy
 */
public class PaintPanel extends JPanel {

    private Image backgroundImage;

    private BufferedImage paintImage;

    public PaintPanel() {
        try {
            // replace this image with your image
            backgroundImage = ImageIO.read(new File("E:\\icons\\blackboard.png"));
            paintImage = new BufferedImage(backgroundImage.getWidth(this), 
                    backgroundImage.getHeight(this), BufferedImage.TYPE_INT_ARGB);
        } catch (final Exception e) {
            e.printStackTrace();
        }

    }

    public void fillRect() {
        final Graphics g = paintImage.createGraphics();
        g.setColor(Color.RED);
        g.fillRect(0, 0, 50, 50);
        g.dispose();
        repaint();
    }

    public void clearRect() {
        final Graphics2D g = paintImage.createGraphics();
        g.setColor(new Color(0, 0, 0, 0));
        g.setComposite(AlphaComposite.Clear); // overpaint
        g.fillRect(0, 0, 50, 50);
        g.dispose();
        repaint();
    }

    /**
     * {@inheritDoc}
     */
    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);
        g.drawImage(backgroundImage, 0, 0, this);
        g.drawImage(paintImage, 0, 0, this);
    }

    /**
     * {@inheritDoc}
     */
    @Override
    public Dimension getPreferredSize() {
        return new Dimension(backgroundImage.getWidth(this), 
                backgroundImage.getHeight(this));
    }

    public static void main(String[] args) {
        final JFrame frm = new JFrame("Tesp paint");
        final PaintPanel p = new PaintPanel();
        frm.add(p);
        final JPanel buttons = new JPanel();
        final JButton fill = new JButton("Fill Rect");
        fill.addActionListener(new ActionListener() {

            @Override
            public void actionPerformed(ActionEvent e) {
                p.fillRect();
            }
        });
        final JButton clear = new JButton("Clear Rect");
        clear.addActionListener(new ActionListener() {

            @Override
            public void actionPerformed(ActionEvent e) {
                p.clearRect();
            }
        });
        buttons.add(fill);
        buttons.add(clear);
        frm.add(buttons, BorderLayout.SOUTH);
        frm.pack();
        frm.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
        frm.setLocationRelativeTo(null);
        frm.setVisible(true);
    }
}

Answer 2

The easy way to do this is to draw the lines in XOR mode. Then, to erase them, you just draw them again.