fundamentos de graficación

Fundamentos de graficación

Graficación en Java

Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

2

¿Qué es un gráfico?

En su forma más simple un gráfico puede ser visto como una representación de puntos o “píxeles” agrupados de manera que permitan percibir visualmente alguna superficie, dibujo o forma.

La pantalla de un computador puede ser vista como una matriz de píxeles.


3

¿Cómo se pueden crear programas gráficos?

Hay que tener claro que no todas las pantallas permiten llevar a cabo dibujos sobre ellas.

Existen algunos tipos de terminales que solo permiten desplegar caracteres de texto.

Algunos ejemplos de interfaces de texto son las pantallas de comandos de algunos sistemas operativos.


4

¿Cómo se pueden crear programas gráficos? (continuación)

Para graficar se necesita contar con un sistema operativo con soporte gráfico y el hardware apropiado.

La cantidad de píxeles por pulgada en una pantalla y la variedad de colores pueden variar de un computador a otro y de un sistema operativo a otro.

Dadas las condiciones anteriores se puede graficar si el lenguaje de programación cuenta con instrucciones o primitivas de graficación.


5

¿En que se diferencia una ventana gráfica vs. una ventana para despliegue de texto?

En la ventana de texto el tipo de letra y “font” es el mismo para toda la ventana.

El despliegue de texto es a nivel de línea y no a nivel de píxel.

El control del despliegue se lleva a cabo enviando caracteres a pantalla , incluyendo caracteres especiales como tabuladores cambios de línea, retornos y otros.

No permite la presentación de dibujos y texto juntos.

En la ventana gráfica se pueden combinar diferentes tipos de letra, tamaños y colores en una misma ventana.

La pantalla no se compone de líneas de texto sino que es vista como una matriz de “píxeles”.

Texto y dibujos se pueden colocar juntos en cualquier dirección y a partir de cualquier punto de la pantalla.


6

¿Cuáles clases de Java son importantes para manejar gráficos?

Las clases más importantes de java para graficación pertenecen a las bibliotecas de “awt” o Abstract Windowing Toolkit y a las clases de manejo de componentes SWING incluyendo:javax.swing.JFrame; // Creación de ventanajava.awt.Graphics; // Primitivas de graficaciónjava.awt.Color; // Manejo de coloresjava.awt.Font; // Manejo de tipos de letraExiste también el Java 3D para manejo de gráficos tridimensionales.


7

¿Cómo crear una ventana gráfica en Java?

La clase JFrame permite crear ventanas utilizando el paquete javax.swing.

Para crear una ventana basta con crear una instancia de la misma, asignarle un tamaño inicial y ejecutar el método “show” para visualizarla.


8

Visualización de una ventana gráfica en Java

EJEMPLO 1 – Creación de una ventana en Java

Ir al ejemplo

EJERCICIO 1 – Creación de una ventana en Java

Ir al ejercicio


11

Nota importante

A diferencia del JOptionPane que “bloquea” o se queda esperando a que el usuario ejecute alguna opción, al mostrar ventanas el programa continúa con la siguiente instrucción inmediatamente.

Note que el código del Ejemplo 1 no termina con la instrucción System.exit(0), ya que si el programa principal finaliza y sale, las ventanas desaparecerían.

Si se crean varias ventanas se pueden mostrar todas a la vez y mostrarlas o cerrarlas cuantas veces se desee.

Siempre es posible definir ventanas de manera que si esta se cierra el programa termina por lo que todas las demás ventanas se cerrarán también.


12

¿Cómo finalizar el programa al presionar el botón de cierre?

Por omisión cuando se presiona el botón de cerrar en una ventana esta solamente deja de ser visible pero sigue activa en memoria.

Si se desea que la aplicación finalice al cerrar la ventana, hay que cambiar el comportamiento por omisión asociado al botón.

Se puede indicar que se desea que el programa “salga al cerrar” de la siguiente forma:ventana.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);


13

¿Cómo crear varias ventanas a la vez? Ejemplo (continuación)

Si se presiona “cerrar” en la ventana principal

el programa finaliza

Si se presiona “cerrar” en la ventana secundaria esta solamente deja de ser “visible” pero sigue

en memoria.

EJEMPLO 2 – Creación de múltiples ventanas

Ir al ejemplo

EJERCICIO 2 – Creación de múltiples ventanas

Ir al ejercicio


16

¿Cómo puedo dibujar gráficos en Java?

En los JFrame el método que dibuja se llama: paint() Una manera de dibujar es crear una nueva clase para

ventanas, con instrucciones específicas dentro del método paint().

La programación por objetos ofrece un mecanismo llamado Herencia que permite “heredar” todos los atributos y métodos de una clase preexistente y extenderla o sobrecargar alguno de sus métodos.

Para dibujar basta con crear una nueva clase que “extienda” o “herede” toda la funcionalidad de un JFrame pero que tenga sobrecargado el método paint()

La Herencia es tratada en profundidad en el siguiente curso.


17

Visualización de uso de gráficos en Java

EJEMPLO 3 – Creación de un gráfico dentro de una ventana

Ir al ejemplo

EJERCICIO 3 – Creación de un gráfico dentro de una ventana

Ir al ejercicio


20

¿Cómo funcionan las coordenadas de una ventana gráfica?

La ventana puede ser vista como una matriz compuesta por “píxeles” de colores.

Las dimensiones normalmente se expresan en “pixeles” (ancho,alto)

Posición (0,0)

Se ubica en la esquina superior izquierda e incluyendo el título ancho

altoEl píxel ubicado en la posición (75,150) se ubica:75 píxeles a la derecha y150 hacia abajo a partir de la esquina superior izquierda


21

¿Cómo puedo utilizar diferentes colores?

La información del contexto gráfico se almacena en un objeto de la clase Graphics.

Al dibujar texto o formas dentro del objeto Graphics, se utiliza el color asociado al contexto.

El método para asociar un Color dentro del contexto gráfico Graphics es el siguiente:public void setColor(Color color)


22

¿Cómo se pueden crear Colores?

Se pueden crear colores usando cualquiera de los dos constructores:– Color (int rojo, int verde, int azul)– Color (float rojo, float verde, float azul)

Los tres parámetros representan los tres componentes básicos del color (rojo, verde, azul). Son enteros de 0 a 255 o flotantes de 0.0f a 1.0f.

Además existen colores constantes estáticos previamente definidos dentro de la clase Color.


23

¿Cuales son algunos colores predefinidos?

Instancia Valores (RGB) ColorColor.black ( 0 , 0 , 0 ) negroColor.white (255,255,255) blancoColor.gray (128,128,128) grisColor.red (255, 0 , 0 ) rojoColor.green ( 0 ,255, 0 ) verdeColor.blue ( 0 , 0 ,255) azulColor.cyan ( 0 ,255,255) cyanColor.magenta (255, 0 ,255) magentaColor.yellow (255,255, 0 ) amarilloColor.orange (255,200, 0 ) anaranjadoColor.pink (255,175,175) rosado


24

¿Cómo puedo dibujar una línea en java?

Para dibujar una línea se utiliza el método drawLine que recibe las coordenadas del punto de origen (x1, y1) y el punto final (x2,y2)

De la siguiente forma:public void drawLine(int x1,int y1,int x2,

int y2)


25

Utilización de líneas en Java

EJEMPLO 4 – Graficación de líneas de distintos colores

Ir al ejemplo

EJERCICIO 4 – Graficación de líneas de distintos colores

Ir al ejercicio


28

¿Cómo puedo dibujar un óvalo en Java?

Los óvalos incluyendo los círculos se especifican definiendo un rectángulo dentro del cual se “circunscriben”.

Por lo tanto los parámetros son la esquina superior izquierda del rectángulo (x,y) dentro del cual se encierra el óvalo y el ancho y alto.

Si se desea un óvalo relleno (“filled”) se puede utilizar el método fillOval() de forma similar al drawOval() que simplemente dibuja el borde.


29

¿Qué significan los parámetros del drawOval y del fillOval en Java?

Las coordenadas (x,y) indican la posición de la esquina superior izquierda del rectángulo que encierra al óvalo

ancho

alto

public void drawOval(int x, int y, int ancho, int alto)

public void fillOval(int x, int y, int ancho, int alto)

(x , y)


30

Visualización del uso de óvalos en Java

EJEMPLO 5 – Graficación de un óvalo

Ir al ejemplo

EJERCICIO 5 – Graficación de un óvalo

Ir al ejercicio


33

¿Cómo puedo dibujar un rectángulo en Java?

El rectángulo se define mediante el método drawRect() que recibe como parámetros la esquina superior izquierda, el ancho y el alto del rectángulo.

Si se desea relleno y no solo el borde se puede utilizar el método fillRect()

Si se desea limpiar un área rectangular utilizando el color del fondo se puede utilizar el método clearRect()

public void drawRect(int x, int y, int ancho, int alto)

public void fillRect(int x, int y, int ancho, int alto)

public void clearRect(int x, int y, int ancho, int alto)


34

Visualización del uso de rectángulos en Java

EJEMPLO 6 – Graficación de un rectángulo

Ir al ejemplo

EJERCICIO 6 – Graficación de un rectángulo

Ir al ejercicio


37

¿Cómo puedo dibujar un polígono en Java?

La clase Graphics cuenta con los siguientes métodos:public void drawPolygon(int xPoints[], int

yPoints[], int points)public void drawPolygon(Polygon p)public void fillPolygon(int xPoints[], int

yPoints[], int points)public void fillPolygon(Polygon p)


38

Visualización del uso de polígonos en Java

EJEMPLO 7 – Graficación de polígonos

Ir al ejemplo

EJERCICIO 7 – Graficación de polígonos

Ir al ejercicio


41

¿Cómo puedo dibujar un arco en java?

El arco consiste en un fragmento de un óvalo, con un ángulo de inicio y una amplitud de arco. public void drawArc(int x, int y, int ancho,

int alto, int anguloInicial,int anguloDelArco)

public void fillArc(int x, int y, int ancho,int alto, int anguloInicial,int anguloDelArco)


42

Visualización del uso de arcos en Java

EJEMPLO 8 – Graficación de arcos

Ir al ejemplo

EJERCICIO 8 – Graficación de arcos

Ir al ejercicio


45

¿Cómo puedo dibujar texto en java?

Un contexto gráfico tiene también asociado un “font”“font” o fuente de texto.

Para dibujar texto se utiliza el método:drawString(String, int, int)// Clase Graphics.

Los parámetros corresponden al texto y coordenadas de la esquina inferior izquierda del texto, o inicio del renglón sobre el que se escribe.


46

¿Cómo puedo crear un tipo de letra nuevo o “Font”?

La clase Font permite manipular el tipo, el estilo y el tamaño de la letra.

El tipo se refiere al String que describe el nombre de la fuente. Por ejemplo: “Serif”, “Monospaced”, “SansSerif”.

El estilo puede ser: – Font.BOLD, (negrita).– Font.PLAIN, (normal).– Font.ITALIC, (cursiva).

El tamaño de la letra es medido en pixeles.


47

¿Cómo puedo crear un tipo de letra nuevo o “Font”? (continuación)

Ejemplos de instancias de tipo Font:– Font(“Serif”, Font.BOLD, 12);– Font(“Monospaced”, Font.ITALIC + Font.BOLD, 24);

– Font(“SansSerif”, Font.PLAIN, 14);Los métodos para de Graphics para

asignar un nuevo Font es el siguiente:– public void setFont(Font fuente);


48

Visualización del uso de texto en Java

EJEMPLO 9 – Graficación de texto

Ir al ejemplo

EJERCICIO 9 – Graficación de texto

Ir al ejercicio

EJEMPLO 10 – Utilización de graficación para resolución de

problemas

Ir al ejemplo

EJERCICIO 10 – Utilización de graficación para resolución de

problemas

Ir al ejercicio

fundamentos de graficación

Documents