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:
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: