freehand drawline using mouse events

Question

may i know if there is any formula for drawing lines? currently i am implementing a freehand draw line in java, however the code below when drawn it is not what im expecting. i have tried g.drawLine(arg0.getX(), arg0.getY(), arg0.getX(), arg0.getY()); , however the line drawn is not continous rather it is drawing points, i read that it is because the mouse drag happens at intervals, if so how should i record the points?

import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.event.MouseMotionListener;

import javax.swing.JPanel;

public class STDrawingArea extends JPanel implements MouseListener, MouseMotionListener {
    /**
     * 
     */
    private static final long serialVersionUID = 1L;

    int xPressed,yPressed;
    int xReleased,yReleased;
    int xDragged,yDragged;
    public STDrawingArea()
    {
        setPreferredSize(new Dimension(1280, 700));
        setBounds(0, 0, 1280, 700);
        setBackground(Color.WHITE);
        addMouseListener(this);
        addMouseMotionListener(this);

    }



    @Override
    public void mouseDragged(MouseEvent arg0) {
        Graphics g = getGraphics();
        xDragged = xPressed;
        yDragged = yPressed;
        g.drawLine(xPressed, yPressed, arg0.getX(), arg0.getY());
        xDragged = arg0.getX();
        yDragged = arg0.getY();
    }

    @Override
    public void mouseMoved(MouseEvent arg0) {
        // TODO Auto-generated method stub

    }

    @Override
    public void mouseClicked(MouseEvent arg0) {
        // TODO Auto-generated method stub

    }

    @Override
    public void mouseEntered(MouseEvent arg0) {
        // TODO Auto-generated method stub

    }

    @Override
    public void mouseExited(MouseEvent arg0) {
        // TODO Auto-generated method stub

    }

    @Override
    public void mousePressed(MouseEvent arg0) {
        // TODO Auto-generated method stub
        xPressed = arg0.getX();
        yPressed = arg0.getY();
        System.out.println("xPressed: "+xPressed+" ,yPressed: "+yPressed);
    }

    @Override
    public void mouseReleased(MouseEvent arg0) {
        // TODO Auto-generated method stub
        xReleased = arg0.getX();
        yReleased = arg0.getY();
        System.out.println("xReleased: "+xPressed+" ,yReleased: "+yPressed);
    }


}

Answer 1

Try This. It's working. There is no need to use the Point class and iterate the 'for' loop, If you wanna simply make a Freehand Drawing.

    import java.awt.BorderLayout;
    import java.awt.Color;
    import java.awt.Dimension;
    import java.awt.Graphics;
    import java.awt.event.ActionEvent;
    import java.awt.event.ActionListener;
    import java.awt.event.MouseEvent;
    import java.awt.event.MouseListener;
    import java.awt.event.MouseMotionListener;
    import javax.swing.JButton;
    import javax.swing.JFrame;
    import javax.swing.JPanel;

    class STDrawingArea extends JPanel implements MouseListener,MouseMotionListener,ActionListener
    {
        int xPressed,yPressed;
        int xReleased,yReleased;
        int xDragged,yDragged;
        private JButton clear;
        public STDrawingArea()
        {
            setPreferredSize(new Dimension(1200, 500));
            setBounds(0, 0, 480, 500);
            //setBackground(Color.YELLOW);
            clear=new JButton("CLEAR");
            add(clear);
            clear.setBounds(540, 5, 100, 25);
            clear.addActionListener(this);
            addMouseListener(this);
            addMouseMotionListener(this);
        }

        @Override
        public void actionPerformed(ActionEvent e) 
        {
             if(e.getSource()==clear)
            {
                setOpaque(false);
                repaint();
            }
        }

        @Override
        protected void paintComponent(Graphics g)
        {
            g.drawLine(xPressed,yPressed,xDragged,yDragged);
            xPressed=xDragged;
            yPressed=yDragged;
        }

        @Override
        public void mouseDragged(MouseEvent arg0) {
            Graphics g = getGraphics();
            g.drawLine(xPressed, yPressed, arg0.getX(), arg0.getY());
            xDragged = arg0.getX();
            yDragged = arg0.getY();
            repaint();
        }

        @Override
        public void mouseMoved(MouseEvent arg0) {
            // TODO Auto-generated method stub

        }

        @Override
        public void mouseClicked(MouseEvent arg0) {
            // TODO Auto-generated method stub

        }

        @Override
        public void mouseEntered(MouseEvent arg0) {
            // TODO Auto-generated method stub

        }

        @Override
        public void mouseExited(MouseEvent arg0) {
            // TODO Auto-generated method stub

        }

        @Override
        public void mousePressed(MouseEvent arg0) {
            // TODO Auto-generated method stub
            setOpaque(true);
            xPressed = arg0.getX();
            yPressed = arg0.getY();
        }

        @Override
        public void mouseReleased(MouseEvent arg0) {
            // TODO Auto-generated method stub

        }
    }
    class Frame4 extends JFrame
    {
        private STDrawingArea da;
        public Frame4()
        {
            da=new STDrawingArea();
            da.setBackground(Color.YELLOW);
            da.setLayout(new BorderLayout());
            add(da);
        }
    }
    public class FreeHandDrwing 
    {
        public static void main(String s[])
        {
            Frame4 ob=new Frame4();

            ob.setVisible(true);
            ob.setBounds(100, 100, 1200, 500);
            ob.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        }
    }

Answer 2

Some slight Changes are required

 @Override
public void mouseDragged(MouseEvent arg0) {
    Graphics g = getGraphics();

    g.drawLine(xDragged, yDragged, arg0.getX(), arg0.getY());
    xDragged = arg0.getX();
    yDragged = arg0.getY();
}

and

 @Override
public void mousePressed(MouseEvent arg0) {
    // TODO Auto-generated method stub
    xPressed = arg0.getX();
    yPressed = arg0.getY();
    System.out.println("xPressed: "+xPressed+" ,yPressed: "+yPressed);
    xDragged=xPressed;
    yDragged=yPressed;
}

I have compiled and executed this code and found its perfectly working..:-)

Answer 3

A simple way to do this might be:

1. Maintain a List of Points in your component

   • In the mouseDragged() method, get the point (MouseEvent#getPoint()) and add it to your list

2. Override the paintComponent() method of the JPanel

   • Iterate over all points in your list of points
   • Draw lines between each pair of points (except the first and last, of course)

---

For example, you might make the following changes:

private ArrayList<Point> points = new ArrayList<Point>();

//...

public void mouseDragged(MouseEvent arg0) {
    points.add(arg0.getPoint());
    repaint(); //request Swing to refresh display as soon as it can
}

//...

protected void paintComponent(Graphics g)
{
    super.paintComponent(g);

    for (int i = 0; i < points.size() - 2; i++)
    {
        Point p1 = points.get(i);
        Point p2 = points.get(i + 1);

        g.drawLine(p1.x, p1.y, p2.x, p2.y);
    }
}