Crear lienzo usando Java Swing

Mehvish Ashiq 15 febrero 2024
Crear lienzo usando Java Swing

En Java, podemos hacer un lienzo de dos formas, usando Java AWT o Java Swing. Hoy aprenderemos a usar Java Swing para hacer un lienzo y dibujar formas.

Use Java Swing para crear un lienzo

Código de ejemplo (la clase PaintPanel.java):

// write your package here
package com.voidtesting.canvas;
// import necessary libraries
import java.awt.Graphics;
import java.awt.Point;
import java.awt.event.MouseEvent;
import java.awt.event.MouseMotionAdapter;
import javax.swing.JPanel;

public class PaintPanel extends JPanel {
  // count the number of points
  private int pointCounter = 0;
  // array of 10000 Point references
  private Point[] points = new Point[10000];

  // make GUI and register the mouse event handler
  public PaintPanel() {
    // handles frame mouse motion event
    addMouseMotionListener(new MouseMotionAdapter() {
      // store the drag coordinates and repaint
      @Override
      public void mouseDragged(MouseEvent event) {
        if (pointCounter < points.length) {
          // find points
          points[pointCounter] = event.getPoint();
          // increment point's number in the array
          ++pointCounter;
          // repaint JFrame
          repaint();
        } // end if
      } // end mouseDragged method
    } // end anonymous inner class
    ); // end call to the addMouseMotionListener
  } // end PaintPanel constructor

  /*
  draw oval in a 5 by 5 bounding box at the given location
  on the window
  */
  @Override
  public void paintComponent(Graphics g) {
    // clear drawing area
    super.paintComponent(g);
    // draw all points that we have in array
    for (int i = 0; i < pointCounter; i++) g.fillOval(points[i].x, points[i].y, 5, 5);
  } // end paintComponent method
} // end PaintPanel Class

Código de ejemplo (la clase Canvas.java):

// write your package here
package com.voidtesting.canvas;
// import necessary libraries
import java.awt.BorderLayout;
import java.awt.Label;
import javax.swing.JFrame;

public class Canvas {
  public static void main(String[] 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(paintPanel, BorderLayout.CENTER);
    // place the created label in the south of BorderLayout
    jFrame.add(new Label("Drag the mouse to draw"), BorderLayout.SOUTH);
    // exit on close
    jFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    // set frame size
    jFrame.setSize(500, 400);
    // set jFrame location to center of the screen
    jFrame.setLocationRelativeTo(null);
    // display frame
    jFrame.setVisible(true);
  }
}

Producción:

hacer lienzo usando java swing - dibujar en lienzo

En la clase PaintPanet.java, extiende el JPanel para crear un área comprometida para dibujar. La clase Punto representa las coordenadas x e y.

Creamos un objeto de la clase Point para guardar todas las coordenadas de cada evento de arrastre del mouse mientras que la clase Graphics se usa para dibujar. Para este ejemplo, usamos una matriz de tipo Punto que contiene los 10,000 puntos/coordenadas que almacenan la ubicación donde ocurre cada evento de arrastre del mouse.

Podemos ver que el paintComponent utiliza estas coordenadas para dibujar. Tenga en cuenta que la variable de instancia denominada pointCounter aún realiza un seguimiento del número total de puntos capturados a través del evento de arrastre del mouse.

Tan pronto como alcance el límite de 10,000, no podremos dibujar más.

Luego, registramos el MouseMotionListener que puede escuchar el evento de movimiento del mouse de la clase PaintPanel. Dentro del oyente addMouseMotionListener(), creamos un objeto de la clase interna anónima que extiende la clase adaptadora denominada MouseMotionAdapter.

¿Por qué anulamos mouseDragged? Debido a que MouseMotionAdapter implementa MouseMotionListener, el objeto de clase interno anónimo es MouseMotionListener. La clase interna anónima hereda las implementaciones predeterminadas mouseMoved y mouseDragged.

Entonces, ya implementa todos los métodos de la interfaz. Sin embargo, el método predeterminado no realiza nada cada vez que se llaman, por lo que anulamos mouseDragged para capturar los puntos del evento de arrastre del mouse y guardarlos como el objeto Punto.

La declaración if asegura que solo guardamos los puntos en la matriz si tenemos la capacidad. El método getPoint() se invoca para recuperar las coordenadas donde ocurrió el evento, guardarlas en el array points en el índice pointCounter, y luego incrementar el pointCounter también.

Antes de sacar la instrucción if, usamos el método repaint() que maneja las actualizaciones del ciclo de pintura. A continuación, el método paintComponent recibe el parámetro de Graphics que se llama automáticamente cada vez que se debe mostrar el PaintPanel en la pantalla de la computadora.

Dentro del método paintComponent, invocamos la superclase de paintComponent para despejar el área de dibujo. Recuerda que usamos la palabra clave super para acceder a los métodos e instancias de la superclase.

Dibujamos un óvalo de 5 por 5 en la ubicación dada por cada punto en una matriz que puede llegar hasta el pointCounter, mientras que el método fillOval() dibuja el óvalo sólido.

Ahora, llegando al Canvas.java, la clase principal. Crea los objetos de JFrame y PaintPanel.

Luego, usamos el método add() para agregar el objeto del PaintPanel al centro de la ventana JFrame. Usamos BorderLayout.CENTER para agregarlo en el centro de la ventana JFrame.

A continuación, agregamos una Label en el sur de la ventana JFrame usando BorderLayout.SOUTH. Después de eso, usamos los métodos setDefaultCloseOperation(), setSize(), setLocationRelativeTo() y setVisible() para cerrar la ventana cuando el usuario hace clic en el signo de cruz (X), establecer el tamaño de la ventana JFrame, mueva la ventana JFrame al centro de la pantalla de la computadora y muéstrela respectivamente.

En lugar de dibujar manualmente en el lienzo, podemos dibujar mediante programación.

Código de ejemplo (la clase Draw.java tiene el método main):

// write your package here
package com.voidtesting.canvas.draw;
// import necessary libraries
import java.awt.BorderLayout;
import java.awt.Color;
import java.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 background color
    this.setBackground(Color.cyan);

    // set color of the shape
    g.setColor(Color.red);
    // draw line
    g.drawLine(5, 30, 380, 30);

    // set color of the shape
    g.setColor(Color.blue);
    // draw rectangular
    g.drawRect(5, 40, 90, 55);

    // set color of the shape
    g.setColor(Color.BLACK);
    // draw string
    g.drawString("Hi, how are you?", 100, 50);

    // set color of the shape
    g.setColor(Color.green);
    // draw filled rectangular
    g.fill3DRect(5, 100, 90, 55, true);
    // draw filled oval
    g.fillOval(150, 100, 90, 55);
  }

  public static void main(String[] args) {
    // create JFrame Object
    JFrame jFrame = new JFrame("Canvas");
    // add the object of Draw Class in center
    jFrame.add(new Draw(), 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(null);
    // display frame
    jFrame.setVisible(true);
  }
}

Producción:

hacer lienzo usando java swing - dibujar programáticamente en lienzo

Mehvish Ashiq avatar Mehvish Ashiq avatar

Mehvish Ashiq is a former Java Programmer and a Data Science enthusiast who leverages her expertise to help others to learn and grow by creating interesting, useful, and reader-friendly content in Computer Programming, Data Science, and Technology.

LinkedIn GitHub Facebook

Artículo relacionado - Java Swing