How To Draw An Animation Using Java Swing

Create Sail Using Java Swing

Created: June-xxx, 2022

In Java, we can brand a canvas in two ways, using Coffee AWT or Java Swing. Today, nosotros will learn how to use Coffee Swing to make a canvas and depict shapes.

Utilize Java Swing To Create a Canvas

Instance Code (the PaintPanel.java Class):

              //write your package here package com.voidtesting.sheet; //import necessary libraries import java.awt.Graphics; import java.awt.Signal; import java.awt.event.MouseEvent; import java.awt.outcome.MouseMotionAdapter; import javax.swing.JPanel;  public class PaintPanel extends JPanel {      //count the number of points     private int pointCounter = 0;     //array of 10000 Indicate references     private Indicate[] points = new Betoken[10000];      //brand GUI and annals the mouse event handler     public PaintPanel() {         //handles frame mouse motility event         addMouseMotionListener(                 new MouseMotionAdapter(){                     //store the elevate coordinates and repaint                     @Override                     public void mouseDragged(MouseEvent event) {                         if (pointCounter < points.length) {                             //find points                             points[pointCounter] = consequence.getPoint();                             //increment point'due south number in the array                             ++pointCounter;                             //repaint JFrame                             repaint();                         }//end if                     }//end mouseDragged method                 }//end bearding inner class         );//stop call to the addMouseMotionListener     }//end PaintPanel constructor      /*     depict oval in a v by 5 bounding box at the given location     on the window     */     @Override     public void paintComponent(Graphics thousand) {         //clear drawing expanse         super.paintComponent(one thousand);         //draw all points that we accept in array         for (int i = 0; i < pointCounter; i++)             1000.fillOval(points[i].ten, points[i].y, five, 5);     }//terminate paintComponent method }//end PaintPanel Class

Example Lawmaking (The Canvas.java Grade):

              //write your package here package com.voidtesting.canvas; //import necessary libraries import coffee.awt.BorderLayout; import java.awt.Label; import javax.swing.JFrame;  public class Canvas {      public static void principal(Cord[] args) {         //create JFrame Object         JFrame jFrame = new JFrame("Canvas Using Java Swing");         //create PaintPanel Object         PaintPanel paintPanel = new PaintPanel();         // add paintPanel in center         jFrame.add together(paintPanel, BorderLayout.CENTER);         //identify the created characterization in the due south of BorderLayout         jFrame.add( new Characterization ("Elevate the mouse to describe"), BorderLayout.Southward);         //get out on close         jFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);         //set frame size         jFrame.setSize(500, 400);         //ready jFrame location to center of the screen         jFrame.setLocationRelativeTo(null);         //brandish frame         jFrame.setVisible(truthful);     } }

Output:

make canvas using java swing - draw on canvas

In the PaintPanet.java grade, information technology extends the JPanel to create a committed surface area for drawing. The grade Point represent the ten and y coordinates.

We create an object of the Point class to relieve all the coordinates of every mouse drag event while the Graphics class is used to draw. For this example, we use an array of Point type containing the 10,000 points/coordinates that stores the location where every mouse drag event happens.

We can see that the paintComponent use these coordinates to draw. Please note that the instance variable named pointCounter withal keeps track of the full number of points captured via mouse drag event.

Equally shortly as it reaches the limit of 10,000, we volition non be able to describe anymore.

And then, we register the MouseMotionListener that can listen to the mouse motion event of the PaintPanel grade. Within the addMouseMotionListener() listener, nosotros create an object of the bearding inner class that extends the adapter grade named MouseMotionAdapter.

Why do nosotros override mouseDragged? Because the MouseMotionAdapter implements the MouseMotionListener, the anonymous inner class object is the MouseMotionListener. The anonymous inner class inherits the default mouseMoved and mouseDragged implementations.

So, it already implements all the methods of the interface. Yet, the default method performs zilch whenever those are called, which is why nosotros override the mouseDragged to capture the points of the mouse drag effect and save them as the Point object.

The if statement ensures that we only save the points in the array if we have the capacity. The getPoint() method is invoked to retrieve the coordinates where the event happened, save them in the points array at index pointCounter, and so increase the pointCounter also.

Before getting out the if statement, we apply the repaint() method that handles the updates to the pigment cycle. Next, the paintComponent method receives the parameter of Graphics which is chosen automatically whenever the PaintPanel must be displayed on the calculator screen.

Inside the paintComponent method, we invoke the superclass of the paintComponent to the articulate drawing expanse. Recollect that we employ the super keyword to admission the superclass' methods and instances.

We draw a 5 past 5 oval at the given location by every point in an array which tin become upwardly to the pointCounter while the fillOval() method draws the solid oval.

Now, coming to the Canvas.coffee, the main course. It creates the objects of JFrame and PaintPanel.

And so, we use the add() method to add the object of the PaintPanel to the center of the JFrame window. Nosotros use BorderLayout.CENTER to add it in the center of the JFrame window.

Adjacent, we add a Label in the south of the JFrame window using BorderLayout.South. Afterward that, nosotros use setDefaultCloseOperation(), setSize(), setLocationRelativeTo(), and setVisible() methods to shut the window when the user clicks on the cantankerous sign (X), gear up the size of the JFrame window, motility the JFrame window to the center of the computer screen and brandish information technology respectively.

Instead of manually cartoon on the sheet, we can describe programmatically.

Instance Code (the Draw.java Grade has the main method):

              //write your packet hither package com.voidtesting.canvas.draw; //import necessary libraries import java.awt.BorderLayout; import java.awt.Color; import coffee.awt.Graphics; import javax.swing.JFrame; import javax.swing.JPanel;  public class Draw extends JPanel {      @Override     public void paintComponent(Graphics g) {         //call method of the super class         super.paintComponent(g);         //set groundwork color         this.setBackground(Colour.cyan);          //ready colour of the shape         g.setColor(Color.red);         //describe line         g.drawLine(v, 30, 380, 30);          //gear up color of the shape         g.setColor(Colour.blue);         //describe rectangular         thousand.drawRect(5, 40, 90, 55);          //set color of the shape         grand.setColor(Colour.Black);         //depict string         g.drawString("Howdy, how are you?", 100, 50);          //set color of the shape         g.setColor(Color.green);         //draw filled rectangular         g.fill3DRect(5, 100, 90, 55, truthful);         //describe filled oval         g.fillOval(150, 100, 90, 55);     }      public static void principal(Cord[] args) {         //create JFrame Object         JFrame jFrame = new JFrame("Canvas");         // add together the object of Draw Class in center         jFrame.add together(new Depict(), BorderLayout.Center);         //exit on close         jFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);         //set frame size         jFrame.setSize(300, 200);         //set jFrame location to center of the screen         jFrame.setLocationRelativeTo(zip);         //display frame         jFrame.setVisible(true);      } }

Output:

make canvas using java swing - programmatically draw on canvas

Write for us

DelftStack articles are written by software geeks like you lot. If you too would like to contribute to DelftStack past writing paid articles, you can check the write for us folio.