Draw a draggable triangle in Java

This example shows how to draw a triangle on a JFrame and make it draggable so it can be moved around by using the mouse. The example contains two classes, one which is the main frame (the JFrame) and one that extends JPanel that does the actual painting and that implements the necessary interfaces needed to make the triangle draggable.

The frame creates and instance of the TrianglePanel class and set a few properties on it like size and background, and then add it to itself. The constructor of the TrianglePanel class takes three Point-objects as parameters and each of them contains the x and y values for one of the three specific points in the triangle.
The code of the frame looks like this:

The actual TriangleFrame class extends JPanel and implement two interfaces, MouseListener and MouseMotionListener. We need the MouseListener to implement some code in the overridden methods mousePressed and mouseReleased. The MouseMotionListener is needed to be able to override the method mouseDragged which is called repeatedly when we hold down the left mouse button and move the mouse around.

Overriding the paintComponent method

Since our class is a subclass of JPanel, it has a method called paintComponent(Graphics g) which we override to implement our code to draw the triangle. First we call the paintComponent method of the superclass so the background will be restored where the triangle was painted the last time. Otherwise we would get a lot of triangles painted when we drag the mouse around over the panel. Then we set the color the triangle will be painted in, and finally draw the triangle by calling the fillPolygon method, passing the polygon object that was instantiated in the constructor as argument.

Overriding the mousePressed method

When we press down the left button of the mouse we need to check whether the current position of the mouse pointer is within the triangle or not. If it is, a boolean flag draggable is set to true. Fortunately we don’t have to make any calculations ourselves to check that out, but instead we can use the handy method contains in the Polygon class and just pass in our position, which we get from the MouseEvent parameter. If the mouse pointer is within the triangle, we store the x and y values of the mouse pointer in member variables.

Overriding the mouseReleased method

When we release the left mouse button the bounds of the triangle needs to be updated, but we choose to just create a new instance of the Polygon. If we don’t do that, we won’t be able to drag this triangle more than once. But now we can drag it across the panel unlimited number of times.

Overriding the mouseDragged method

Every time the mouseDragged method is called we compute the difference between the current cursor position and the last known x and y values for each of the three points in the triangle and update them accordingly in the Polygon object. Finally we need to call repaint to make the triangle show on the new position and the old one disappear. Now the overridden method paintComponent gets called.

Search for more Java info on this site here:
Custom Search

Any thoughts or questions?