1 / 52

Fundamentos de graficación

Fundamentos de graficación. Graficación en Java. ¿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.

otto-faulkner
Download Presentation

Fundamentos de graficación

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Fundamentos de graficación Graficación en Java

  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 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 que se diferencia una ventana gráfica vs. una ventana para despliegue de texto? • 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 ventana java.awt.Graphics; // Primitivas de graficación java.awt.Color; // Manejo de colores java.awt.Font; // Manejo de tipos de letra Existe 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 Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  9. EJEMPLO 1 – Creación de una ventana en Java Ir al ejemplo

  10. 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. 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 secundaria esta solamente deja de ser “visible” pero sigue en memoria. Si se presiona “cerrar” en la ventana principal el programa finaliza Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  14. EJEMPLO 2 – Creación de múltiples ventanas Ir al ejemplo

  15. 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. Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  17. Visualización de uso de gráficos en Java Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  18. EJEMPLO 3 – Creación de un gráfico dentro de una ventana Ir al ejemplo

  19. 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 alto El píxel ubicado en la posición (75,150) se ubica: 75 píxeles a la derecha y 150 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: publicvoid 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) Color Color.black ( 0 , 0 , 0 ) negro Color.white (255,255,255) blanco Color.gray (128,128,128) gris Color.red (255, 0 , 0 ) rojo Color.green ( 0 ,255, 0 ) verde Color.blue ( 0 , 0 ,255) azul Color.cyan ( 0 ,255,255) cyan Color.magenta (255, 0 ,255) magenta Color.yellow (255,255, 0 ) amarillo Color.orange (255,200, 0 ) anaranjado Color.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 Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  26. EJEMPLO 4 – Graficación de líneas de distintos colores Ir al ejemplo

  27. 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. 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 (x , y) ancho alto public void drawOval(int x, int y, int ancho, int alto) public void fillOval(int x, int y, int ancho, int alto) Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  30. Visualización del uso de óvalos en Java Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  31. EJEMPLO 5 – Graficación de un óvalo Ir al ejemplo

  32. 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) Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  34. Visualización del uso de rectángulos en Java Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  35. EJEMPLO 6 – Graficación de un rectángulo Ir al ejemplo

  36. 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) Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  38. Visualización del uso de polígonos en Java Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  39. EJEMPLO 7 – Graficación de polígonos Ir al ejemplo

  40. 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) Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  42. Visualización del uso de arcos en Java Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  43. EJEMPLO 8 – Graficación de arcos Ir al ejemplo

  44. 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” 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: • publicvoid setFont(Font fuente); Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  48. Visualización del uso de texto en Java Autor: Edgar Casasola M. Diseño: Jorge Villalobos S.

  49. EJEMPLO 9 – Graficación de texto Ir al ejemplo

  50. EJERCICIO 9 – Graficación de texto Ir al ejercicio

More Related