laboratorio de graficación - división de estudios de...

45
Laboratorio de Graficación Garibaldi Pineda García [email protected]

Upload: phamthu

Post on 13-Oct-2018

216 views

Category:

Documents


0 download

TRANSCRIPT

Laboratorio de Graficación

Garibaldi Pineda Garcí[email protected]

OpenGL

● API● Máquina de estados● Implementa un pipeline de

visualización 3D

OpenGL

● Básicamente transforma modelos a pixeles

● Evita que el programador tenga que crear un graficador

● El estándar hace posible que los fabricantes de hardware implementen funciones

Proceso de dibujo

● Activar estados globales para la escena completa

● Activar estados para el objeto a dibujar● Dibujar el objeto● Desactivar estados para el objeto recién

dibujado● Repetir los 3 pasos anteriores hasta terminar

Espacio 3D en OpenGL

● Es un espacio cartesiano, de “mano derecha”Y

X

Z

Comandos de Dibujo

● glBegin● Indica a OpenGL que se inicia la entrada de una

secuencia de dibujo de una primitiva● Las primitivas son:

– GL_POINTS, GL_LINES, GL_LINE_STRIP, GL_LINE_LOOP, GL_TRIANGLES, GL_TRIANGLE_STRIP, GL_TRIANGLE_FAN, GL_QUADS, GL_QUAD_STRIP, o GL_POLYGON.

● Debe ir acompañada de un glEnd

Comandos de Dibujo

● Por ejemplo:

glBegin(GL_POINTS)

:

// Definición de vértices

glEnd()

Comandos de Dibujo

● glVertexNT● Especifica la posición del vértice actual● Donde N = 2, 3 ó 4

T = s (short), i (int), f (float) o d (double)

Por ejemplo:

glVertex3f(0.1, 0.2, 0.3)

Comandos de Dibujo

● Juntando los dos anteriores:

glBegin(GL_TRIANGLES)

glVertex3f(0.0f, 0.0f, 0.0f)

glVertex3f(1.0f, 0.0f, 0.0f)

glVertex3f(0.5f, 0.5f, 0.0f)

glEnd()

Comandos de Posición

● glTranslateX● Traslada el origen de coordenadas del mundo

virtual a la posición especificada● X puede ser:

– d (double)– f (float)

● Por ejemplo:

– glTranslatef(-2.0f, 2 .0f, -10.0f)Se traslada dos unidades a la izquierda, dos hacia arriba y diez hacia el fondo

Primera parte de la práctica

● Dados los vértices:

(10, 0), (7,7), (0,10), (-7, 7), (-10,0), (-7,-7),

(0,-10), (7, -7)● Graficarlos usando las siguientes primitivas:

GL_POINTS, GL_LINES, GL_LINE_STRIP, GL_POLYGON, GL_QUADS y GL_TRIANGLES

Primera parte de la práctica

● La imagen final deberá verse como la figura siguiente (sin los números):

1 2 3

4 5 6

Comandos de Color

● glColorNUT● Modifica el estado del color actual de OpenGL● Donde N = 3 (RGB) o 4 (RGBA)

U = u (para b, s o i) ó nada

T = b (byte), s (short), i (int), f(float) o d (double)

● Por ejemplo:

glColor3ub(183, 129, 254)

glColor3f(0.72f, 0.51f, 1.0f)

Comandos de Color

● Se sigue un modelo de color RGBA, es decir, Red-Green-Blue-Alpha (rojo, verde, azul y opacidad)

● La combinación de colores es aditiva – R + G = Y

– G + B = C

– R + B = M

– R + B + G = W

Comandos de Transformación

● Las transformaciones en OpenGL se aplican en el orden inverso a como se especifican– Por ejemplo:

glTranslatef(...)

glScalef(...)

– Primero se escala y después se translada

● El primer comando ya se revisó (glTranslate)

Segunda parte de la práctica

● Graficar líneas indicativas de los ejes X, Y y Z, con diferentes colores:– Cían para el eje X

– Magenta para el eje Y

– Amarillo para el eje Z

● La longitud de los ejes debe ser de 10● Graficar, usando GL_LINE_STRIP la función

seno de color rojo

Comandos de Transformación

● El stack de matrices permite acumular transformaciones de manera sencilla

● Se usan los comandos glPushMatrix() y glPopMatrix()

● Con un glPushMatrix() se crea un “nuevo origen de coordenadas”

Comandos de Transformación

● Los objetos se pueden escalar a lo largo de los tres ejes vía el comando glScaleT (f ó d)

Por ejemplo:

glScalef(2.0, 1.0, 0.5)

Escalaría al doble el eje X, y a la mitad el eje Z

● Se escalan los ejes, hay que tener cuidado el orden en que se acumulan las transformaciones

Práctica

● Trasladar hacia el fondo las coordenadas del mundo● Dibujar los ejes X y Y● Hacer un glPushMatrix● Escalar el sistema coordenado con:

glScalef(2.0f, 1.0f, 1.0f)

● Trasladar 5 unidades a la derecha● Dibujar un cuadrado de tamaño de lado 1● Hacer un glPopMatrix● Tomar un pantallazo

Comandos de Transformación

● El comando para hacer rotaciones es glRotateT (f ó d)

● Las rotaciones se hacen respecto a un eje, la rotación positiva va en el sentido contrario a las manecillas del reloj si se está viendo HACIA el origen del eje

● Se rota el sistema de coordenadas, no el objeto.● Lo más fácil es usar los ejes X, Y o Z, y

combinaciones de ellos

Comandos de Transformación

● Hay que tener cuidado con el orden en que se hacen las transformaciones

● Por ejemplo, no es lo mismo Rotar+Trasladar que Trasladar+Rotar

Práctica

● Generar las pantallas anteriores● Es decir, aplicar rotar+trasladar● Dibujar un cuadrado con un triángulo encima ● Variar el procedimiento, aplicar trasladar+rotar● Dibujar un cuadrado con un triángulo encima

Práctica● Trasladar 15 unidades hacia el fondo

● Hacer PushMatrix

● Rotar(ang_rot1, eje Z)

● Hacer PopMatrix

● Dibujar un cuadrado con un triángulo encima

● Hacer PushMatrix

● Rotar(ang_tras, eje Z), trasladar(10, 0,0)

● Hacer PushMatrix

● Rotar(ang_rot2, eje Z)

● Dibujar un cuadrado con un triángulo encima

● Hacer PopMatrix

● Hacer PopMatrix

Objetos en 3D

● Hasta ahora se han graficado objetos 2D● Alterando la tercer coordenada de la definición

de los vértices se pueden hacer objetos 3D● Existen algunos problemas:

– Habrá que habilitar la prueba de profundidad

– Es recomendable especificar cuál es la prueba que se hace

Habilitar Opciones en OpenGL

● Para habilitar las diferentes opciones de OpenGL se utiliza el comando glEnable

● Se le pasa como argumento un valor predefinido por la librería

– Por ejemplo:

glEnable(GL_DEPTH_TEST);● Para deshabilitar se usa glDisable

Primera parte de la práctica

● Rotar los ejes para una mejor visualización en 3D (30º respecto al eje Y y 30º respecto al eje X)

● Dibujar un cubo en 3D● Comparar el dibujado con y sin habilitar la

prueba de 3D

Uso del teclado

● Se debe implementar la interfaz KeyListener

class Proyecto implements GLEventListener,

KeyListener

● Requiere de 3 métodos keyTyped, keyPressed, y keyReleased; todos aceptan un objeto de evento de teclado KeyEvent

Práctica

● Preparar el método display para rotar el cubo respecto a los ejes X y Y

● Graficar un cubo● Agregar la interfaz KeyListener● Modificar el método keyPressed para

aumentar y disminuir la velocidad del cambio de ángulos

Parámetros de la Cámara

● Se puede modificar la pirámide de visualización

● La utilidad de OpenGL lo hace mediante el comando gluPerspective

● gluPerspective(ángulo, radio de aspecto,

cerca, lejos)

Parámetros de la Cámara

Moviendo la Cámara

● Además de graficar los objetos en su adecuada localización, uno puede mover la cámara virtual de OpenGL

● El comando es una utilidad que genera una matriz de transformación

● El comando es gluLookAt

Moviendo la Cámara

● glLookAt(posX, posY, posZ, dirX, dirY, dirZ,

arribaX, arribaY, arribaZ)

Práctica

● Dibujar un cubo de tamaño de lado = 1● Rotar un poco en dos ejes (30º)● Mover la cámara usando gluLookAt, hacerlo al

rededor del cubo● Poner “boca arriba” la cámara modificando el

vector “hacia arriba”

Lado de las Caras de un Polígono

● Un polígono tiene dos caras● Se puede elegir cuál es la cara frontal vía

glFrontFace, con las opciones GL_CW y GL_CCW. El default es CCW.

● Si se elige GL_CCW (sentido contrario a las manecillas del reloj) se puede conocer la cara frontal usando la “regla de la mano derecha”

Se sigue el orden de los vértices con los dedos de la mano derecha y la cara frontal será hacia donde apunte el pulgar

Lado de las Caras de un Polígono

CCW

Lado de las Caras de un Polígono

● Si se elige GL_CW (sentido de las manecillas del reloj) se puede conocer la cara frontal usando la “regla de la mano izquierda”

Se sigue el orden de los vértices con los dedos de la mano derecha y la cara frontal será hacia donde apunte el pulgar

Lado de las Caras de un Polígono

● El comando para especificar qué cara eliminar es glCullFace

● Se puede forzar a eliminar las caras frontales, traseras o frontales y traseras (GL_FRONT, GL_BACK, y GL_FRONT_AND_BACK)

● Habrá que tener cuidado como se definen las caras

● Hace más ligero el programa, pues no se grafican ambas caras

Primer ejercicio de la práctica

● Activar la eliminiación de caras ocultas● Elegir eliminar las caras CW● Graficar un cubo de tamaño de lado 10● Elegir eliminar las caras CCW● Graficar el mismo cubo

Texturas

● El proceso requiere de cargar los datos de la textura en una localidad de memoria

● Se puede escoger la aproximación para diferentes tamaños de visualización

● Después se especifica cuál textura usar y con qué coordenadas

Texturas

● El método para cargar una textura depende del sistema/lenguaje

● La textura se carga del disco duro a la RAM, después se hace un “objeto textura” que maneja OpenGL

● Se explica el código en Java

Texturas

● Antes de cargar la imagen al objeto textura, se deben especificar el tipo de filtros minimización/magnificación [ glTexParameteri ]

● Finalmente se genera el objeto textura [ glTexImage2D ]

Texturas

● Para aplicar la textura al polígono, se debe habilitar el uso de las mismas [ glEnable(GL.GL_TEXTURE_2D) ]

● Escoger qué textura se va a utilizar [ glBindTexture ]

● Especificar el pixel [0, 1] que le corresponde a cada vértice [ glTexCoord2d ]

Texturas

● Notas:

– Recordar deshabilitar las texturas para los vértices siguientes [ glDisable(GL.GL_TEXTURE_2D) ]

– Escoger el modo de mezclado entre colores de vértice y colores de textura [ glTexEnvf ]

Blending (mezclado)

● El blending permite combinar los colores de diferentes polígonos

● Debe especificarse la operación que se desea

Iluminación