Curso de Graficación

Programa

Contenido Oficial

Herramientas

Para el curso se utilizará una versión de Delphi o Lazarus reducida con los elementos básicos para el desarrollo de interfaces gráficas de usuario (GUI).

Las Bibliotecas de apoyo a ser utilizadas son las siguientes:

Apoyos

Cada ejemplo contiene la interfase de usuario y su código.

Curso primavera 2012


Tema Archivo
D1. Lineas al Azar: MoveTo, LineTo
D2. Accediendo a los Pixeles
D3. Botones, Pluma, Brocha, Cuadros y Círculos; salvar BMP
D3. Cículos, Elipses, Centrado, Sleep
D4. Modelos 3D OFF en ASCII (Proy - City)

Curso primavera 2013


Tema Archivo
D1. Pintando Lineas: MoveTo, LineTo y Pixel[X,Y]
D2. Eventos de Ratón y componentes visuales útiles
D3. Trazos Simples( por pixel y usando MoveTo y LineTo), Figuras de Biblioteca y Salvar Imagen
D4. Prototipo de Graficador de funciones cartesianas y = f(x) con escalado
D5. Fase 1: Prototipo de Editor Gráfico: Estructura de Datos, Lectura de Archivo y desplegado simple
D5a. Fase 2: Prototipo de Editor Gráfico: Posición, traslación y Rotación. De tarea implentar Escalamiento
D5b. Fase 3: Se incluye la carga e inserción de múltiples objetos mediante dos arreglos: uno para los tipos de figura y otro para el manejo del escenario (instancias de las figuras) ** ARREGLADO **
D5c. Fase 4: Se incluye un StringGrid para manejar y seleccionar los objetos en el Escenario, se conectan los métodos de traslación y rotación desarrollados para una figura fija con la instancia seleccionada en el StringGrid
D6. Se realiza la proyección de un modelo simple 3D, codificado en el esquema "puntos-trazos", usando la Proyección "Caballera" de la Geometría Descriptiva
D7. Objetos Básicos con GLScene1.1 (OpenGL)
D8. Animación de Objetos Básicos con GLScene1.1 (OpenGL): tamaño, color, rotación y posición
D9. Mallas con Polígonos con GLScene1.1 (OpenGL)
D10. Mallas con Triángulos y una función en Z con GLScene1.1 (OpenGL)
D11. Manejo de la Estructura Meshcon GLScene1.1 (OpenGL)
D12. Otro ejemplo de manejo del Mesh con GLScene1.1 (OpenGL)
D13. Manejo de Texturas sobre objetos Geométricos con GLScene1.1 (OpenGL)
D14. Manejo de archivos OFF para modelos 3D con GLScene1.1 (OpenGL)
D15. Prototipo de Visualidaro de Moléculas en 3D con GLScene1.1 (OpenGL)
D16. Ejemplo para operar un Manejador de Colisiones en 3D con GLScene1.1 (OpenGL)

Proyectos Primera Entrega

A continuación se listan los proyectos completos del curso.

Proyecto Archivo
1. Gráfico de funciones 2D
2. Editor de Objetos 2D
3. Mini Juego 2D
4. Conjuntos de Julia 2D
5. Superficies 3D
6. Editor 3D
7. Visor de Moléculas 3D
7a. Archivos de ejemplo con descripciones de moléculas 3D
7b. Archivo con colores para los átomos
8. Mini Juego 3D
Calendario de Revisión de Proyectos

Curso Verano 2013


T e m a Archivo
D-01. Introducción al diseño y manejo de interfaces gráficas (GUI)
D-02. Manejo de Pixeles y Lienzos
D-03. LineTo/MoveTo trazo de una linea y atributos de la linea
entrada de datos
D-04. Carga y Salva un BitMap. Directo y mediante la librería GFX
D-05. Dibujando Polígonos.
Etiquetas (TLabel), Cajas de Texto (TEdit), Listas de Texto (TListBox) y Caja de Selección (TComboBox)
Tarea:
1. Incluir la variable m en la interface para ser leida desde ella
2. Incluir una opción para salvar el BitMap del lienzo en un archivo usando la librería GFX

D-06. Entrada y salida (IO) con archivos de Texto, Manejo de Menús de Persiana
Tarea:
1. Completar la parte de leer los datos de un archivo y enviarlos al Memo
2. Incluya un proceso para limpiar el Memo dentro del Menú Principal (MainMenu)
3. Incluir el ícono de la aplicación

D-07. Avance del Proyecto del Graficador de Datos y Funciones: interface, gráfico de funciones y datos para los casos de coordenadas cartesianas y polares. Incluye escalado a lienzo completo con margen.
Preámbulo del Proyecto:
1. Incluir la parte de Gráfico de Barras
2. Incluir la parte de Gráfico de Diagramas Circulares (Pastel)
3. Salvar la descripción de las funciones
4. Salvar el Gráfico como un BitMap en Disco (usando la librería gfx)

D-08. Ejemplo de manejo de relojes para animación
Casos:
1. Movimiento velocidad constante
2. Movimiento acelerado con función SENO
3. Movimiento Circular
x. Ejemplo de Annulus

Tarea: Crear una Mini Rueda de la Fortuna con un Annulus y 4 cilindros, que gire respecto al centro del Annulus
D-09. Construcción de una superficie usando lineas. Modelo de Marco de Alambre.

Tarea:Construir una Lámina ondulada de techo de 4 m. de largo, 1.5 m de ancho y 3 ondulaciones transversales con una altura de 15 cm
D-0A. Inclusión de ayudas para una aplicación
D-0B. Construcción de una figura 3D en base a parches poligonales (la Silla de Villa)
Tarea: Construya una figura con polígonos 3D, que use entre 12 y 16 puntos; y de 4 a 8 parches
D-0C. Construcción de una superficie 3D producto de la evaluación de una función z=f(x,y) en base a parches triangulares (Campana de Gauss)
Tarea: Incluya el parser y construya una interfase que permita cambiar:
Los intervalos de evaluación, el número de puntos en cada eje, el color del fondo y el color de la malla.
D-0D. Construcción de una espiral plana en 3D mediante la Estructura de Datos TGLMesh, usando el modelo de TriangleStrip y el modo VNC, con una sola cara.


D-0E. Igual que en ejemplo anterior, pero se construyen las dos caras
Tarea: Construya una figura similar con 200 segmentos, pero que se desarrolle sobre una circunferencia de radio 3 en el plano X-Y, centrada en el origen; y con una altura H=1 en el eje Z; de tal forma que se enrolle una sola vez sobre la circunferencia. A esta figura se le conoce como Cinta de Moebius
D-0F. Ejemplo para cargar un Archivo de descripción en Texto de una Figura 3D (formato OFF) formada por un arreglo de puntos y un arreglo de parches.

Tarea: Extienda la Aplicación para que se puedan cargar varios objetos 3D en éste Formato de tal manera que cada uno se pueda manipular de forma independiente y sea posible cambiar: su posición, sus ángulos de rotación, sus escalas y su color. Utilice una lista en forma visual para seleccionar la figura. Luego de seleccionarla actualice los datos en la interface con los de esa figura. Esto permite modificarla a ella.

D-10. Manejo de los colores en los vértices de un Triángulo (recuerde que se puede extender a Quad y Polígonos). Se presentan cuatro variantes de coloreo.

Tarea: Cree un cilindro con un gradiente de colores con dos opciones: que el cambio se haga a lo largo de él (sobre la circunferencia) o que se haga a lo alto de él (sobre su altura). Ambiente el escenario con dos lámparas una sobre el eje Z y otra lateral sobre le eje X o el eje Y. Incluya en la interface una opción para cambiar los colores de trabajo.

D-11. Manejo de Texturas para objetos geométricos simples.

Tarea: Construya una Escena que tenga un cubo como base (piso de la escena), luego con la bilioteca de objetos de Princeton construya un ambiente con al menos 6 objetos "texturizados" y escalados adecuadamente. Al menos dos de sus objetos deben estar animados. Incluya dos lámparas.
Incluya una opción que permita cambiar el color de las lámparas y su intensidad.

D-12. Selección de objetos sobre el buffer del SceneViewer

Tarea: Construya una Escena con 8 objetos diferentes y de diferente color. Cree un arreglo para manejar los objetos y al Click en alguno de ellos elabore una interface que permita rotarlo.

D-13. Trazado de Arcos y Rebanadas de Pastel

Nota: Use el método para el Proyecto de Gráficos 2D.

Proyectos y Tareas de fin de curso

A continuación se listan los proyectos completos del curso.

Proyecto Archivo
00. Lista de Tareas
01. Graficador de Funciones, Histogramas y Pasteles 2D
02. Editor de Objetos 2D
03. Superficies Cartesianas y Paramétricas en 3D
04. Editor de Escenarios 3D basado en Objetos tipo Malla en Formato OFF

Curso Otoño 2014


Primera parte desarrollada con python 2.7 y bilioteca de GUI: PyQt4

T e m a Archivo
01. Conjunto de ejemplos parte 1: Ventana, puntos, texto y líneas
02. Conjunto de ejemplos parte 2: (ZetaCode) Pluma, Brocha, comboBox, LineEdit, keyPress y Boton
03. Ejemplos de graficado, combinando UI y trazos:
- Espiral Simple
- Espiral con lectura de Num. Vueltas
- Estrellas (doble ventana)
Los dos segundos ejemplos ya incorporan la UI de lectura.

04. Figura simple y Rotación:
- La interface se crea con QtDesigner: Qt-01.ui
- Se transforma con pyuic4 y se genera el código pyton: qt_01.py
- Se incluye en la App la interface transformada: codigo_02.py
Se incluye el ejemplo inicial codigo_01.py.

05. Figura simple y Rotación ( simple y acumulativa ) :
- La interface se crea con QtDesigner: Qt-02a.ui
- Se transforma con pyuic4 y se genera el código pyton: qt_02a.py
- Se incluye en la App la interface transformada: codigo_02a.py

06. Rota, Escala y Traslada Figura simple:
- La interface se crea con QtDesigner: Qt-03.ui
- Se transforma con pyuic4 y se genera el código pyton: qt_03.py
- Se incluye en la App la interface transformada: codigo_03.py

07. Lee el nombre de un archivo (QFileDialog), lo abre y muestra
- La interface se crea con QtDesigner: Qt-04-archi.ui
- Se transforma con pyuic4 y se genera el código pyton: qt_04_archi.py
- Se incluye en la App la interface transformada: codigo_04_archi.py

08. Grafica una funcion usando el parser
- La interface se crea con QtDesigner: Qt-05.ui
- Se transforma con pyuic4 y se genera el código pyton: qt_func.py
- Se incluye en la App la interface transformada: gfun-01.py

09. Trazado en colores del atractor fractal de Barry Martin (Hopalong)
10. GLScene. Escena simple con doble cámara
11. GLScene. Escena simple una cámara y rotación de la escena usando el Mouse
12. GLScene. Se incorpora a la escena un DummyCube para controlar varios objetos.
Se incluye en la interface un control (TrackBar) para cambiar la intensidad de la iluminación.
Se usa un reloj (AsyncTimer) para crear una animación, se usa un botón para prenderla y apagarla.
Se programa la rueda del ratón (Wheel) para escalar la escena de forma global.
13. GLScene. Se anima la lámpara (cambio de posición)
14. GLScene. Colisiones y el Collision Manager
15. GLScene. Se arma una mesa de aire virtual y se anima el disco. Se hace rebotar en las paredes
16. GLScene. Se utiliza un objeto genérico para seleccionar un objeto de entre varios en tiempo de ejecución y se cambian sus propiedades usando en dial del mouse (rota, escala)

17. GLScene. Se crea una interface para cargar archivos de modelos sólidos 3D del tipo 3DS y MD2. Se incluyen varios modelos de ejemplo.
Si se quisiera incluir modelos en otros formatos incluir la librería correspondiente. Revisar En los códigos fuente de GLScene los formatos soportados e incluir en los USES la librería correspondiente.
18. GLScene. Se muestra como utilizar la Clase "Skydome" para crear un horizonte, cielo y colocar estrellas en el hemisferio
19. GLScene. Se Adapta el código del Ejemplo "actortwocam" para que corra fuera del área de Demos de GLScene. El código también se modifica para que no se generen "hongos" en la zona central de la escena y evitar colisiones en la fase inicial. Revisar el código ya que utiliza un mecanismo de clonación llamado "proxies".

Tareas y Proyectos

A continuación se listan las Tareas del curso.

Proyecto Archivo
00. Instalar WinPyton (Windows) o Python con QT4 en Linux o Mac. Usar versión 2.7.x
01. Incorporar en el ejemplo de Estrellas el Widget de Selección de color y cambiar dinámicamente el color de la pluma
02. Estudiar el uso de QtDesigner y la manera de convertir el archivo de salida *.ui en XML a una interface de Python
03. Estudiar las funciones generadoras de fractales tipo atractor suministradas en el archivo adjunto
El archivo anexo incluye los trabajos a entregar para la evaluación del curso.
Debe entregarse así mismo la documentación que se indica para cada proyecto.
La entrega se hará de forma individual o en equipos de hasta 2 alumnos(as).
No se aceptan equipos más grandes.
Calendario de Entrega de Trabajos y Proyectos