fundamentos de graficación
Post on 13-Mar-2016
98 Views
Preview:
DESCRIPTION
TRANSCRIPT
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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);
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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)
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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)
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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)
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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)
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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)
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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)
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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.
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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);
Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.
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
top related