Why are drawn lines automatically erased?

I am building up a system with a canvas where user can draw lines by dragging the mouse in Java. I want all the strokes to be stored and displayed. However, when I press the mouse to draw a new line, previous lines are automatically erased, which is not what I was expecting. How can I solve this problem?

Here is my code:

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;

public class FreeDrawing extends JPanel implements MouseListener,   MouseMotionListener {

private int indexOfStroke = 0;
private int indexOfPoint = 0;

private Stroke[] strokes = new Stroke[50];
private Point[] currentPoints = new Point[500];

public FreeDrawing(String name) {
    super();

    this.addMouseListener(this);
    this.addMouseMotionListener(this);

    JFrame fr = new JFrame(name);

    fr.add(this);
    fr.setSize(500, 500);

    setBackground(Color.GRAY);

    fr.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    fr.setVisible(true);
}

public void paintComponent(Graphics g) {
    System.out.println("Paint");

    super.paintComponents(g);

    strokes[indexOfStroke] = new Stroke();
    for (int i = 0; i < indexOfPoint - 1; i++) {
        System.out.println("Really draw");

        g.drawLine(currentPoints[i].x, currentPoints[i].y, currentPoints[i + 1].x, currentPoints[i + 1].y);
    }
}

public void mouseDragged(MouseEvent e) {
    System.out.println("Drag");

    currentPoints[indexOfPoint] = new Point(e.getX(), e.getY());
    indexOfPoint++;

    repaint();
}

public void mousePressed(MouseEvent e) {
    System.out.println("Press");

    currentPoints[indexOfPoint] = new Point(e.getX(), e.getY());
    indexOfPoint = 0;
    repaint();
}

public void mouseReleased(MouseEvent e) {
    indexOfPoint = 0;
    indexOfStroke++;
}

public void mouseExited(MouseEvent e) {
}

public void mouseClicked(MouseEvent e) {
}

public void mouseEntered(MouseEvent e) {
}

public void mouseMoved(MouseEvent e) {
}

public static void main(String[] args) {
    FreeDrawing canvas = new FreeDrawing("Mouse");
}
}

class Stroke {

    public Stroke() {
        System.out.println("Stroke initiated");
        points = new Point[500];
    }

    Point[] points;
}

Solution

Because, that's how painting works, see Painting in AWT and Swing and Performing Custom Painting for more details.

Basically, painting is destructive, meaning that each time paintComponent is called, you are expected to repaint the entire state of the component from scratch

One thing you might consider doing, is creating a class which contains the stroke, color and points you need to each line and store that in a List each time you click

import java.awt.BasicStroke;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.EventQueue;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Point;
import java.awt.Stroke;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.awt.event.MouseMotionAdapter;
import java.awt.geom.Line2D;
import java.util.ArrayList;
import java.util.List;
import java.util.Random;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.UIManager;
import javax.swing.UnsupportedLookAndFeelException;

public class Test {

    public static void main(String[] args) {
        new Test();
    }

    public Test() {
        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                try {
                    UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
                } catch (ClassNotFoundException | InstantiationException | IllegalAccessException | UnsupportedLookAndFeelException ex) {
                    ex.printStackTrace();
                }

                JFrame frame = new JFrame("Testing");
                frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                frame.add(new TestPane());
                frame.pack();
                frame.setLocationRelativeTo(null);
                frame.setVisible(true);
            }
        });
    }

    public class TestPane extends JPanel {

        private List<Drawing> drawings;
        private Drawing current;

        private Random rnd = new Random();

        public TestPane() {
            drawings = new ArrayList<>(25);
            addMouseListener(new MouseAdapter() {
                @Override
                public void mousePressed(MouseEvent e) {
                    Stroke stroke = new BasicStroke(rnd.nextInt(9) + 1, BasicStroke.CAP_ROUND, BasicStroke.JOIN_ROUND);
                    Color color = new Color(rnd.nextInt(255), rnd.nextInt(255), rnd.nextInt(255));
                    current = new Drawing(stroke, color);
                    current.addPoint(e.getPoint());
                    drawings.add(current);
                }
            });

            addMouseMotionListener(new MouseMotionAdapter() {
                @Override
                public void mouseDragged(MouseEvent e) {
                    current.addPoint(e.getPoint());
                    repaint();
                }
            });
        }

        @Override
        public Dimension getPreferredSize() {
            return new Dimension(200, 200);
        }

        @Override
        protected void paintComponent(Graphics g) {
            super.paintComponent(g);
            Graphics2D g2d = (Graphics2D) g.create();
            for (Drawing drawing : drawings) {
                drawing.paint(g2d);
            }
            g2d.dispose();
        }

    }

    public class Drawing {

        private Stroke stroke;
        private Color color;
        private List<Point> points;

        public Drawing(Stroke stroke, Color color) {
            this.stroke = stroke;
            this.color = color;
            this.points = new ArrayList<>(25);
        }

        public void addPoint(Point p) {
            points.add(p);
        }

        public void paint(Graphics2D g) {
            Graphics2D g2d = (Graphics2D) g.create();
            g2d.setColor(color);
            g2d.setStroke(stroke);
            if (!points.isEmpty()) {
                Point from = points.get(0);
                for (Point to : points.subList(1, points.size())) {
                    g2d.draw(new Line2D.Double(from, to));
                    from = to;
                }
            }
            g2d.dispose();
        }

    }

}