Jack Kong
Jack Kong

Reputation: 109

Drawing shape on mouse drag

class MyPanel extends JPanel implements Observer, MouseMotionListener, MouseListener {
private MyModel model;
private View view; 
private String mode; 
private Rectangle rectangle;
private Square square;

public MyPanel(MyModel model, View view) {
    this.setBackground(Color.black);
    this.setPreferredSize(new Dimension(300, 300));
    this.addMouseListener(this);
    this.addMouseMotionListener(this);
    this.model = model;
    this.model.addObserver(this);

}

public void paintComponent(Graphics g) {

    super.paintComponent(g);
    Graphics2D g2d = (Graphics2D) g;

    ArrayList<Rectangle> rectangles = this.model.getRectangles();
    for (Rectangle r : getRectangles()) {

        int width = Math.abs(r.getStartPoint().getX() - r.getEndPoint().getX());
        int height = Math.abs(r.getStartPoint().getY() - r.getEndPoint().getY());
    }

    ArrayList<Square> squares = this.model.getSquares();

    for (Square sqr : getSquares()) {

        int xPosition = Math.min(sqr.getStartPoint().getX(), sqr.getEndPoint().getX());
        int yPosition = Math.min(sqr.getStartPoint().getY(), sqr.getEndPoint().getY());
        int width = Math.abs(sqr.getStartPoint().getX() - sqr.getEndPoint().getX());
        int height = Math.abs(sqr.getStartPoint().getY() - sqr.getEndPoint().getY());       
    }

    g2d.dispose();
}

public void update(Observable o, Object arg) {
    this.repaint();
}

@Override
public void mouseDragged(MouseEvent e) {

    if (this.mode.equals("Rectangle")) {

        this.rectangle.setEndPoint(e.getX(), e.getY());
        this.model.addRectangle(this.rectangle);
    }

    else if (this.mode.equals("Square")) {


        // What code should I add here?

        this.model.addSquare(this.square);

    }

}

// MouseListener below
@Override
public void mouseClicked(MouseEvent e) {}

@Override
public void mousePressed(MouseEvent e) {

    if (this.mode.equals("Rectangle")) {
        this.rectangle = new Rectangle(e.getX(), e.getY());
    }

    else if (this.mode.equals("Square")) {
        this.square = new Square(e.getX(), e.getY());

    }
}

@Override
public void mouseReleased(MouseEvent e) {

    if (this.mode.equals("Rectangle")) {

        this.rectangle.setEndPoint(e.getX(), e.getY());
        this.model.addRectangle(this.rectangle);
        this.rectangle = null;
    }

    else if (this.mode.equals("Square")) {
        this.model.addSquare(this.square);
        this.square = null;
    }

}

@Override
public void mouseEntered(MouseEvent e) {}
@Override
public void mouseExited(MouseEvent e) {}

}

The user chooses a mode, rectangle or square. Then they can draw a square or a rectangle with their mouse (live feedback is shown). Here is my drawing panel class. I was successfully able to implement the rectangle mode. The user can draw a rectangle and as they move their mouse, the rectangle is shown in mid construction. I want to do the same for the square mode. For some reason, I'm having a hard time doing this. How would I show a perfect square in mid construction when the user is moving their mouse and how would I draw it once released? What code should I add to my paintComponent method, mouseDragged, mousePressed and mouseReleased method to do this? It was easy for a rectangle because there was no constraint but I'm not sure how to do it for a square with my current implementation.

Upvotes: 0

Views: 932

Answers (1)

camickr
camickr

Reputation: 324098

    int width = Math.abs(r.getStartPoint().getX() - r.getEndPoint().getX());
    int height = Math.abs(r.getStartPoint().getY() - r.getEndPoint().getY());

I would guess that the "size" of the square would be the maximum of the above two values.

Then I would think you would just use:

r.drawStyle(g2d, xPosition, yPosition, size, size);

Upvotes: 1

Related Questions