Diario de un programador. Día 180
Dibujando líneas en Java
Para dibujar
líneas en Java hay que utilizar un sistema de coordenadas, el mismo que se ha
visto en oportunidades anteriores, donde la ubicación 0,0 corresponde a la
esquina superior izquierda.
En este
tutorial, se van a ver varias instrucciones nuevas así que trataré de
explicarlas poco a poco.
Lo primero que
vamos a hacer es dibujar una simple línea diagonal en una ventana gráfica,
donde posteriormente iremos agregando más líneas.
Lo primero que
haremos será crear un proyecto nuevo. En mi caso el proyecto se llama Grafico01.
Este proyecto tiene dos clases, una que llamé Inicio y la otra que llamé
Ventana
En primer lugar voy a escribir en la clase
Ventana.
En esta clase,
lo primero que voy a hacer es importar dos clases. La clase Graphics, que se
encuentra en el paquete java.awt y la clase JPanel, que se encuentra en el
paquete javax.swing
La clase
Graphics proporciona varios métodos que
permiten dibujar texto y figuras en la pantalla, mientras la clase JPanel, proporciona un área en la cual podemos
dibujar.
Para importar ambas clases hacemos
lo siguiente en la clase Ventana:
import
java.awt.Graphics;
import
javax.swing.JPanel;
Una vez escrito lo anterior, lo siguiente es crear la clase,
la cual creamos de la siguiente forma:
import java.awt.Graphics;
import javax.swing.JPanel;
public class Ventana extends JPanel{
}
Esta clase
incluye algo que no habíamos visto hasta ahora, la palabra extends, significa
que la clase Ventana hereda las características y atributos de la clase JPanel.
En resumidas cuentas, esto significa que la clase Ventana podrá ocupar los
métodos de la clase JPanel. El tema de la herencia es otra de las
características de la programación orientada a objetos. La herencia la
estudiaremos con más detalle en futuros tutoriales.
Lo siguiente que
debemos crear, es un método que el sistema llama automáticamente cada vez que
necesita llamar a JPanel. Todo JPanel
debe tener este método, el cual se escribe de la siguiente forma:
import java.awt.Graphics;
import javax.swing.JPanel;
public class Ventana extends JPanel{
public void paintComponent(Graphics g){
}
}
Este método se llama cuando se muestra un objeto JPanel por primera vez en la
pantalla, cuando una ventana en la pantalla lo cubre y después lo descubre, y
cuando la ventana en la que aparece cambia su tamaño.
La primera instrucción que debe tener todo método
paintComponent es la siguiente:
import java.awt.Graphics;
import javax.swing.JPanel;
public class Ventana extends JPanel{
public void paintComponent(Graphics g){
super.paintComponent(g);
}
}
Esta instrucción asegura que
el panel se despliegue apropiadamente en la pantalla antes de empezar a dibujar
en él.
Lo siguiente que vamos a
ocupar, aunque no es obligatorio es interesante. Son los métodos getHeight() y
getWidth(), los cuales en este caso devolverán el alto y el ancho del objeto
JPanel. Estos valores los almacenaremos en unas variables llamadas "alto"
y "ancho", de la siguiente manera:
import java.awt.Graphics;
import javax.swing.JPanel;
public class Ventana extends JPanel{
public void paintComponent(Graphics g){
super.paintComponent(g);
int alto = getHeight();
int ancho =
getWidth();
}
}
Por último, vamos a utilizar la referencia g de la clase Graphics para llamar al método drawLine, el cual nos
permitirá dibujar líneas. El método drawLine requiere de cuatro argumentos,
x1,y1 para indicar el comienzo de la línea y x2,y2 para indicar el final de la
línea.
import java.awt.Graphics;
import javax.swing.JPanel;
public class Ventana extends JPanel{
public void paintComponent(Graphics g){
super.paintComponent(g);
int alto = getHeight();
int ancho = getWidth();
g.drawLine(0,0,ancho,alto);
}
}
Las primeras dos coordenadas se establecieron en la coordenada 0,0 lo que
significa que el inicio de la línea se encuentra en la equina superior
izquierda. Las últimas dos coordenadas se establecieron según el ancho y el
alto del panel. Esto significa que el final de la línea se encuentra en la
esquina inferior derecha. Estas coordenadas dibujan una línea diagonal. Si se
cambia el tamaño de la ventana, las líneas se escalarán de manera uniforme ya
que los argumentos se basan en el alto y ancho del panel. Al cambiar el tamaño
de la ventana, el sistema llama a paintComponent para volver a dibujar el
contenido.
Ya con esto, damos por finalizado el código de la clase Ventana. Pasemos ahora
a escribir el código de la clase Inicio.
Para poder colocar el panel necesitamos de un marco, (por esta razón a la
otra clase le di el nombre ventana. Imaginé que la ventana es el vidrio y que
el vidrio debe ser puesto en un marco). Para esto, vamos a importar la clase
JFrame, la cual se encuentra en el paquete javax.swing. Esto quedará de la
siguiente manera:
import
javax.swing.JFrame;
Lo
siguiente es crear la clase y su método main:
import
javax.swing.JFrame;
public
class Inicio {
public static void main(String[]args){
}
Lo siguiente que vamos a hacer es crear una instancia de la clase Ventana,
de la siguiente manera:
Ventana panel = new Ventana();
Esto es algo que ya se sabe hacer
así que no hay nada nuevo que explicar.
Lo siguiente, es crear un objeto de la clase JFrame que permita contener y
mostrar el panel. Esto quedará de la siguiente manera:
import javax.swing.JFrame;
public
class Inicio {
public static void main(String[]args){
Ventana panel = new Ventana();
JFrame marco = new JFrame();
}
Lo siguiente es utilizar un método que permite adjuntar el objeto que
contiene el dibujo al objeto JFrame.
Este es el método add de
JFrame. Se utiliza de la siguiente forma:
import
javax.swing.JFrame;
public
class Inicio {
public static void main(String[]args){
Ventana panel = new Ventana();
JFrame marco = new JFrame();
marco.add(panel);
}
Lo siguiente es dar un tamaño a nuestro marco. Para esto, se utiliza el
método setSize, el cual recibe como
parámetros el ancho y el alto del objeto JFrame.
import
javax.swing.JFrame;
public
class Inicio {
public static void main(String[]args){
Ventana panel = new Ventana();
JFrame marco = new JFrame();
marco.add(panel);
marco.setSize(250,250);
}
El siguiente método, nos permite mostrar el objeto JFrame, cuando se
muestra este objeto, se hace una llamada al método paintComponent. El método a
utilizar es setVisible y se utiliza de la siguiente manera:
import
javax.swing.JFrame;
public
class Inicio {
public static void main(String[]args){
Ventana panel = new Ventana();
JFrame marco = new JFrame();
marco.add(panel);
marco.setSize(250,250);
marco.setVisible(true);
}
Ya por último, nos queda implementar un método que permita que el programa
finalice si el usuario cierra la ventana (presionando la X de la esquina
superior derecha). Sin este método, el programa continuará corriendo si el
usuario cierra la ventana. Este método es setDefaultCloseOperation y utiliza
como argumento JFrame.EXIT_ON_CLOSE, para indicar que el programa debe
finalizar si se cierra la ventana. Este método se vería de la siguiente forma:
import javax.swing.JFrame;
public
class Inicio {
public static void main(String[]args){
Ventana panel = new Ventana();
JFrame marco = new JFrame();
marco.add(panel);
marco.setSize(250,250);
marco.setVisible(true);
marco.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}
Ya está
listo. Al ejecutar el programa esto es lo que debería salir:
Además,
si con el ratón cambias el tamaño de la ventana, la línea se ajusta al tamaño
de esta
Esto es
todo por ahora. Saludos
Gustavo J. Cerda Nilo
Agosto 2016, Octubre 2016
No hay comentarios:
Publicar un comentario