Line drawing with Java swing draw multiple lines
I am trying to draw strings using Java Swing. The goal is to open an image inside the panel and draw lines on that image. When I try to draw the single line and drag the mouse, I get this:
My code:
// Somewhere in the code:
imgLabel= new JLabel(new ImageIcon(buffImage)); // buffImage is a BufferedImage
...
Point point1;
Point point2;
Line2D line2d;
public void draw() {
Graphics2D g1 = this.buffImage.createGraphics();
g1.setRenderingHint(enderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);
g1.setColor(Color.RED);
g1.setStroke(new BasicStroke(1.5f));
if (point1 != null && point2 != null) {
g1.draw(line2d);
this.imgLabel.repaint();
}
}
class ImageMouseListener extends MouseAdapter {
@Override
public void mousePressed(MouseEvent me) {
point1 = me.getPoint();
}
@Override
public void mouseDragged(MouseEvent me) {
point2 = me.getPoint();
line2d = new Line2D.Double(point1, point2);
draw();
}
}
source to share
The correct code you provide for drawing. The problem here is that whenever you move the mouse cursor, the program is going to draw another line from the starting point to the current mouse position, causing you to show us (you just forget to delete the old line).
To fix this, every time the mouse moves, you need to:
- Redraw the previous line using XOR mode
- Draw the second line.
This means you need to keep the previous mouse position for the call mouseDragged()
.
I have implemented something very similar using JOGL instead of Graphics
using setXORMode(Color color)
. This is also available for the Graphics class. You can read about XOR mode in the Graphics class here and here . <w> I don't know what complexity you are going to use in your project, but if you expect more complexity, I would suggest using a library like JOGL. It is very useful.
UPDATE: Addressing overlapped rows
This is a more difficult task. First, if you are curious and want to fully understand why overlapping lines create such an intriguing effect, I would suggest you read this .
I guess the only way is to save each coordinate line and redraw them after each new line drawing
This is a very good first approach. Saving the data structure will cause all the vertices and the shapes they are associated with to allow you to keep calling repaint()
. You should also be aware that this will not make the intersection points stand out on your screen (you will see either the color of one line or another intermediate color), but that should already be your intention.
Do you know what the bounding box is ? You can create a bounding box for any line (or shape) that is a rectangle that surrounds your points.
Suppose you are actually keeping a bounding box for each row. When adding a new line, you can:
- Make sure the line you are about to draw intercepts any bounding boxes.
- If so, redraw all lines associated with these bounding boxes
- Add new line without XOR mode
This method is better than redrawing the entire screen, as there may be an arbitrary number of lines that are already present, and you can write a reasonably efficient algorithm to check for intersection of rectangular boxes.
Note that catching the bounding box does not mean that there is an overlap, because there are some exceptions (like parallel lines) that make this an incorrect assumption. Also keep in mind that the only way to avoid seeing intersections of colored lines due to XOR mode is to draw them without XOR mode. You will need to be very careful to switch the XOR mode at the right time.
I found an interesting page on additional ways to solve this problem, you can check it out here .
source to share