Intro Open GL Visualizacin Computacional 2 1 Qu

  • Slides: 56
Download presentation
Intro Open. GL Visualización Computacional 2 1

Intro Open. GL Visualización Computacional 2 1

¿Qué es Open. GL? n n n Open. GL es una biblioteca para el

¿Qué es Open. GL? n n n Open. GL es una biblioteca para el desarrollo de gráficos por computadora en 2 D y 3 D multiplataforma (Linux, Windows, Unix, Mac. OS, PS 3) Su nombre proviene de Open Graphics Library Es una especificación que define una API (del inglés Application Programming Interface - Interfaz de Programación de Aplicaciones) para la programación de gráficos en varios lenguajes Nota: Referencias de Open. GL Programming Guide, 3 rd Edition ver. 1. 2 (“The Red Book”). 2

Documentación disponible n n El Libro Rojo - The Red Book: The Open. GL

Documentación disponible n n El Libro Rojo - The Red Book: The Open. GL Programmer's guide. n Libro de referencia y tutorial. Libro de cabecera para programadores de Open. GL. El Libro Azul - The Blue Book: The Open. GL Reference manual. n En esencia, una copia de la páginas del manual de Open. GL. 3

Características de Open. GL n n n Objetivos 1. Ocultar complejidad de Hardware 2.

Características de Open. GL n n n Objetivos 1. Ocultar complejidad de Hardware 2. Ocultar las capacidades del Hardware Propósito: Dibujado (puntos, líneas, polígonos) Open. GL como una Máquina de estados (o switches) 4

Open. GL tiene… n n n n Funciones para dibujar en 2 D y

Open. GL tiene… n n n n Funciones para dibujar en 2 D y 3 D Transformaciones Algoritmos de iluminación Z-Buffering Mapeo de Texturas Soporte para Shaders Blending, elementos de antialiasing , efectos de Fog 5

Open. GL no tiene… n n n Funciones para manejar ventanas, eventos de ratón

Open. GL no tiene… n n n Funciones para manejar ventanas, eventos de ratón o teclado Funciones o procedimientos para crear un objeto completo a partir de una descripción natural ejemplo: comando draw. Car(); Soporte nativo para dibujado de curvas Soporte nativo para audio y/o texto Detección de colisiones Carga de imágenes 6

Elementos necesarios n Biblioteca Open. GL Archivos de cabecera (. h, . pas, etc.

Elementos necesarios n Biblioteca Open. GL Archivos de cabecera (. h, . pas, etc. ) n Archivos obj o lib n Verificar el soporte dentro de la plataforma elegida y bibliotecas para su ejecución n n Bibliotecas auxiliares (GLU, Glut) 7

Qué pasa con lo que no tiene n Y las ventanas , mouse, teclado?

Qué pasa con lo que no tiene n Y las ventanas , mouse, teclado? ? n n Imágenes n n n GLUT GL Utility Toolkit API de Win 32 IDE de desarrollo (forms, eventos, etc. ) SDL Image Devil Sonido n n n SDL Mixer Open. AL fmod 8

Sintaxis Básica n Open. GL contiene 3 elementos distintos básicos: Funciones n Constantes n

Sintaxis Básica n Open. GL contiene 3 elementos distintos básicos: Funciones n Constantes n Tipos de datos n 9

Funciones n Usos Dibujado de elementos n Manipulación de proyecciones n Transformaciones Geométricas n

Funciones n Usos Dibujado de elementos n Manipulación de proyecciones n Transformaciones Geométricas n Habilitación / Deshabilitación de “switches” n Texturizado n Aplicación de elementos para lograr iluminación n Cuenta con 150 funciones básicas n 10

Sintaxis de funciones n n n Se anteponen gl si pertenecen a la biblioteca

Sintaxis de funciones n n n Se anteponen gl si pertenecen a la biblioteca Open. GL, glu o glut si son de éstas respectivamente Contienen información al final de cuántos parámetros reciben y cuál es su tipo Ejemplos: gl. Vertex 3 f n gl. Vertex 4 fv n gl. Vertex 2 i n 11

Open. GL Vertex/Color Command Formats gl. Vertex 3 fv( v ) gl. Color 3

Open. GL Vertex/Color Command Formats gl. Vertex 3 fv( v ) gl. Color 3 fv( v ) Number of components 2 - (x, y) 3 - (x, y, z), (r, g, b) 4 - (x, y, z, w), (r, g, b, a) Data Type b ub s us i ui f d - byte unsigned byte short unsigned short int unsigned int float double Vector omit “v” for scalar form– e. g. , gl. Vertex 2 f(x, y) gl. Color 3 f(r, g, b) 12

Constantes n Usos Activar o desactivar ciertas propiedades de dibujado o switches n Dar

Constantes n Usos Activar o desactivar ciertas propiedades de dibujado o switches n Dar ciertos valores a parámetros de funciones que configuran algún elemento n n Todos van con mayúsculas empezando con GL y generalmente tienen _ cuando presentan espacios, ya que sus nombres son muy descriptivos acerca de para que sirven 13

Constantes n Ej. GL_LIGHTING n GL_COLOR_BUFFER_BIT n GL_LINES n n También las encontramos en

Constantes n Ej. GL_LIGHTING n GL_COLOR_BUFFER_BIT n GL_LINES n n También las encontramos en GLUT Ej. n GLUT_LEFT_BUTTON 14

Buffers n n n Color Buffer Depth Buffer Stencil Buffer Accumulation Buffer Selection Buffer

Buffers n n n Color Buffer Depth Buffer Stencil Buffer Accumulation Buffer Selection Buffer 15

n n El Front Buffer es lo que vemos en pantalla finalmente. Se renderiza

n n El Front Buffer es lo que vemos en pantalla finalmente. Se renderiza en Back buffer, luego se llama a Swap. Buffers Texture 1 Accumulation Buffer Stencil Buffer Depth Buffer Back Buffer Texture 2 Window decoration Front Buffer Texture 3 16

Open. GL – Depth Buffer, Double Buffer n n Los buffers almacenan color y

Open. GL – Depth Buffer, Double Buffer n n Los buffers almacenan color y profundidad n Eliminación de partes ocultas. n gl. Enable (GL_DEPTH_TEST); Double buffering: n n Dibujar en un buffer mientras se está mostrando otro. Cuando se termina de renderizar, se intercambian los dos. glut. Swap. Buffers(); rendering // al finalizar el bucle de Borrando buffers: // Borrar la pantalla con un color específico. gl. Clear. Color (0. 0, 0. 0); // Borrar color y depth buffers. gl. Clear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); 17

Máquina de estados n Set: n n n Get: n n gl. Point. Size(size);

Máquina de estados n Set: n n n Get: n n gl. Point. Size(size); gl. Line. Width(width); gl. Line. Stipple(repeat, pattern); gl. Shade. Model(GL_SMOOTH); gl. Get*(); Habilitaciones: n n n gl. Enable(GL_LIGHTING); gl. Disable(GL_TEXTURE_2 D); gl. Is. Enable(GL_DEPTH_TEST); 18

Seteando estados n Open. GL es una máquina de estados: los polígonos son afectados

Seteando estados n Open. GL es una máquina de estados: los polígonos son afectados por el color, la transformación, el modo de render actuales. n Habilitar y deshabilitar opciones como iluminación, uso de texturas y alpha blending. n gl. Enable (GL_LIGHTING); // habilitar lighting (disabled por default) n Olvidarse de habilitar/deshabilitar algo es el origen más común de los bugs. Corroborar siempre el estado de las variables que necesitamos y sus valores por default. (lista de defaults en Apéndice B). 19

Mini “engine” n n n (método draw) Borrar contenido del buffer actual Setear transformaciones

Mini “engine” n n n (método draw) Borrar contenido del buffer actual Setear transformaciones (View Projection, Viewport transf. ) Loop para cada primitiva: Transformaciones n Tipo de primitiva, atributos, estados de render n n Flush o Swap buffers 20

Transformaciones y Vista (Cap. 3) Open. GL tiene 3 modos distintos de matrices: n

Transformaciones y Vista (Cap. 3) Open. GL tiene 3 modos distintos de matrices: n GL_MODELVIEW n GL_PROJECTION n GL_TEXTURE n Por ejemplo, para trabajar con modo projection matrix: gl. Matrix. Mode(GL_PROJECTION); n n n La matriz Modelview se usa para las transformaciones en los objetos. La matrix Projection setea la transformación de perspectiva. Generalmente se setea una vez al comienzo del programa. La matriz Texture es usada para aplicar transformaciones a las coordenadas de textura. 21

MVPV 22

MVPV 22

Operaciones de matrices n n n gl. Matrix. Mode() n GL_PROJECTION n GL_MODELVIEW n

Operaciones de matrices n n n gl. Matrix. Mode() n GL_PROJECTION n GL_MODELVIEW n GL_TEXTURE gl. Load. Identity() gl. Load. Matrix() gl. Mult. Matrix() gl. Push. Matrix() gl. Pop. Matrix() 23

Multiplicación de matrices n gl. Matrix. Mode(GL_MODELVIEW); n n gl. Load. Identity(); gl. Mult.

Multiplicación de matrices n gl. Matrix. Mode(GL_MODELVIEW); n n gl. Load. Identity(); gl. Mult. Matrix(N); gl. Mult. Matrix(M); gl. Mult. Matrix(L); n gl. Begin(GL_POINTS); gl. Vertex 3 f(v); gl. End(); n La transormación final es N(M(Lv)) n n 24

Transformaciones de modelos n n n Mover/trasladar objeto gl. Translate{234}{fd}( x, y, z )

Transformaciones de modelos n n n Mover/trasladar objeto gl. Translate{234}{fd}( x, y, z ) Rotar el objeto en un eje arbitrario gl. Rotate{234}{fd}( angle, x, y, z ) Escalar, deformar, espejar objeto gl. Scale{234}{fd}( x, y, z ) Tutoriales de Nate Robins: http: //www. xmission. com/~nate/tutors. html 25

El orden es importante Internamente se define un nuevo espacio de coordenadas “local” en

El orden es importante Internamente se define un nuevo espacio de coordenadas “local” en términos del espacio de coordenadas anterior. 26

Primitivas en gl. Begin (Cap. 2, p. 44) n n n Puntos GL_POINTS Líneas

Primitivas en gl. Begin (Cap. 2, p. 44) n n n Puntos GL_POINTS Líneas GL_LINES, GL_LINE_STRIP, GL_LINE_LOOP Triángulos GL_TRIANGLES, GL_TRIANGLE_STRIP, GL_TRIANGLE_FAN Cuadrados GL_QUADS, GL_QUAD_STRIP Polígonos GL_POLYGON gl. Begin(GL_LINES); [invocaciones gl. Vertex]; gl. End(); gl. Begin(GL_QUADS); [invocaciones gl. Vertex]; gl. End(); 27

Open. GL: Normales y Luces n n Especificar normales de manera simple como especificamos

Open. GL: Normales y Luces n n Especificar normales de manera simple como especificamos geometría. Normalizar vectores de normales. // each vertex has a different normal here gl. Color 3 f (0. 8, 1. 0, 0. 5); gl. Begin(GL_TRIANGLES); gl. Normal 3 fv (n 0); gl. Vertex 3 fv (v 0); gl. Normal 3 fv (n 1); gl. Vertex 3 fv (v 1); gl. Normal 3 fv (n 2); gl. Vertex 3 fv (v 2); gl. End(); // all vertices have the same normal here gl. Begin(GL_TRIANGLES); gl. Normal 3 fv (n 0); gl. Vertex 3 fv (v 1); gl. Vertex 3 fv (v 2); gl. End(); 28

Open. GL: Luces (Cap. 5 p. 173) n gl. Enable (GL_LIGHTING); n Open. GL

Open. GL: Luces (Cap. 5 p. 173) n gl. Enable (GL_LIGHTING); n Open. GL soporta un máximo de 8 luces. n n n Las luces tienen una posición, un tipo, color, etc. Posición: n n n gl. Enable (GL_LIGHT 0); . . . gl. Enable (GL_LIGHT 7); float light 0 Position[4] = {1. 0, 0. 0, 4. 0, 1. 0}; gl. Lightfv (GL_LIGHT 0, GL_POSITION, light 0 Position); El tipo de una luz es puntual, direccional y spot. El cuarto componente de la posición (1. 0 en el ejemplo) determina el tipo. 0 es para luces direccionales, 1 es para luces puntuales o spots. (pág. 187) Podemos setear componentes de : Ambient, Diffuse, Specular para cada luz. Mirar el texto en el libro. 29

Open. GL: Lighting (cont. ) n Open. GL soporta 2 modelos básicos de shading:

Open. GL: Lighting (cont. ) n Open. GL soporta 2 modelos básicos de shading: flat y smooth. n gl. Shade. Model(GL_FLAT); gl. Shade. Model(GL_SMOOTH); 30

Open. GL: Propiedades de material (Cap. 5) n Se pueden especificar diferentes propiedades de

Open. GL: Propiedades de material (Cap. 5) n Se pueden especificar diferentes propiedades de material para los polígonos. n n Usar gl. Material*(GLenum face, GLenum pname, TYPE param); Ejemplos (pname), pág. 202: n n GL_AMBIENT: Ambient color del material GL_DIFFUSE: Diffuse color del material GL_SPECULAR: Componente Specular GL_SHININESS: Exponente Specular 31

Open. GL: Texturing n Cargar los datos en crudo n n Setear valores de

Open. GL: Texturing n Cargar los datos en crudo n n Setear valores de entorno n n Provienen de una imagen: tga, bmp, jpg Creados en tiempo de ejecución El resultado final es siempre un arreglo Crear nombres de textura, construir Mipmaps, setear filtros, etc. Mapear la textura a los polígonos n Especificar coordenadas s, t para los vértices del polígono. 32

Open. GL: Texturing n Cargar los datos n n Unidades y clases que cargan

Open. GL: Texturing n Cargar los datos n n Unidades y clases que cargan imágenes. Setear valores de entorno n Crear nombre de textura n n n gl. Gen. Textures(int num, int* tex. Names) gl. Bind. Texture(GL_TEXTURE_2 D, tex. Name); Escala, aplicación y Mipmapping n glu. Scale. Image(…) n gl. Tex. Parameteri(GL_TEXTURE_2 D, GL_TEXTURE_WRAP_S, GL_CLAMP); gl. Tex. Parameteri(GL_TEXTURE_2 D, GL_TEXTURE_WRAP_T, GL_CLAMP); n n glu. Build 2 DMipmaps(…); 33

Creación de apps n n n GLUT Forms y handles Api de Windows 34

Creación de apps n n n GLUT Forms y handles Api de Windows 34

GLUT – Open. GL Utility Toolkit (Apéndice D) n GLUT es una librería que

GLUT – Open. GL Utility Toolkit (Apéndice D) n GLUT es una librería que maneja los eventos del sistema y las ventanas de la aplicación en múltiples plataformas. Ejemplo código: int main (int argc, char *argv[]) { glut. Init(&argc, argv); glut. Init. Display. Mode (GLUT_DEPTH | GLUT_DOUBLE | GLUT_RGBA); glut. Init. Window. Size (window. Width, window. Height); glut. Init. Window. Position (0, 0); glut. Create. Window (“ 248 Video Game!"); Set. States(); // Initialize any rendering states (your code). Register. Callbacks(); // Set up event callbacks (your code, coming up). } glut. Main. Loop(); return 0; // Transfer control to GLUT. Doesn’t return. 35

GLUT Event Callbacks n Registrar funciones que son llamadas cuando un determinado evento ocurre.

GLUT Event Callbacks n Registrar funciones que son llamadas cuando un determinado evento ocurre. Ejemplos: glut. Display. Func( Display ); glut. Keyboard. Func( Keyboard ); glut. Reshape. Func( Reshape ); glut. Mouse. Func( Mouse ); glut. Passive. Motion. Func( Passive. Func ); glut. Motion. Func( Mouse. Dragged. Func ); glut. Idle. Func( Idle ); // // called when its time to draw receives key input called when window reshapes called when button changes mouse moves, no buttons mouse moves, some buttons called whenever idle 36

Forms y Handles (llamadas a API win 32) Ejemplo código: procedure TForm 1. Form.

Forms y Handles (llamadas a API win 32) Ejemplo código: procedure TForm 1. Form. Create(Sender: TObject); begin init. Opengl; dc: =Get. DC(Panel 1. Handle); init. Pixel. Format(); rc : =wgl. Create. Context(dc); wgl. Make. Current(dc, rc); gl. Init; Resize(); end; 37

Api de Windows n Utilizamos la API de windows para crear nuestra propia ventana

Api de Windows n Utilizamos la API de windows para crear nuestra propia ventana y manejar nuestros eventos. Ejemplo código: function gl. Create. Wnd(Width, Height : Integer; Fullscreen : Boolean; Pixel. Depth : Integer) : Boolean; var … begin h_Instance : = Get. Module. Handle(nil); //Grab An Instance For Our Window Zero. Memory(@wnd. Class, Size. Of(wnd. Class)); // Clear the window class structure with wnd. Class do // Set up the window class begin style : = CS_HREDRAW or // Redraws entire window if length changes CS_VREDRAW or // Redraws entire window if height changes CS_OWNDC; // Unique device context for the window lpfn. Wnd. Proc : = @Wnd. Proc; // Set the window procedure to our func Wnd. Proc h. Instance : = h_Instance; h. Cursor : = Load. Cursor(0, IDC_ARROW); 38 lpsz. Class. Name : = 'Open. GL';

Bindings - Open. GL http: //nehe. gamedev. net/data/lessons/lesson. asp? lesson=02 n n n n

Bindings - Open. GL http: //nehe. gamedev. net/data/lessons/lesson. asp? lesson=02 n n n n n n ASM Code Borland C++ Builder 6 Be. OS C# Code VB. Net Cs. GL Code Warrior 5. 3 Cygwin D Language Delphi Dev C++ Game GLUT Code Irix Code Java/SWT C Jedi-SDL Jo. GL LCC Win 32 Linux/GLX Linux/SDL n n n n LWJGL Mac OS X/Cocoa MASM Power Basic Pelles C Perl Python QT/C++ REALbasic Ruby Scheme Solaris Visual Basic Visual Fortran Visual Studio. NET 39

Ejemplos - Tutoriales BSP Loader 40

Ejemplos - Tutoriales BSP Loader 40

Ejemplos - Tutoriales Fog 41

Ejemplos - Tutoriales Fog 41

Ejemplos - Tutoriales Fuentes 42

Ejemplos - Tutoriales Fuentes 42

Ejemplos - Tutoriales Heightmap, Multitextura, Skybox 43

Ejemplos - Tutoriales Heightmap, Multitextura, Skybox 43

Ejemplos - Tutoriales MD 3 Loader - Animación 44

Ejemplos - Tutoriales MD 3 Loader - Animación 44

Ejemplos - Tutoriales Wavefront OBJ Loader 45

Ejemplos - Tutoriales Wavefront OBJ Loader 45

Ejemplos - Tutoriales Selección 46

Ejemplos - Tutoriales Selección 46

Ejemplos - Tutoriales Partículas 47

Ejemplos - Tutoriales Partículas 47

Ejemplos - Tutoriales Render to texture 48

Ejemplos - Tutoriales Render to texture 48

Ejemplos - Tutoriales Skyboxes 49

Ejemplos - Tutoriales Skyboxes 49

Ejemplos - Tutoriales Variados 50

Ejemplos - Tutoriales Variados 50

Trabajos Prácticos n Salón de exposiciones: Datos en pantalla n Environment Mapping (modelo) n

Trabajos Prácticos n Salón de exposiciones: Datos en pantalla n Environment Mapping (modelo) n Sombras y/o reflejos (habitación) n Efecto adicional (blending, lightmaps) n 51

Trabajos Prácticos n Juego de ajedrez: Transparencias (piezas) n Reflejos (sobre tablero) o Environment

Trabajos Prácticos n Juego de ajedrez: Transparencias (piezas) n Reflejos (sobre tablero) o Environment Mapping (piezas) n Sombras (tablero) n Selección de objetos en 3 D n 52

Trabajos Prácticos n Shoot Game: Efectos con partículas n Modelos animados n Transparencias o

Trabajos Prácticos n Shoot Game: Efectos con partículas n Modelos animados n Transparencias o máscaras de textura n Selección de objetos en 3 D n 53

Trabajos Prácticos n Mundos virtuales (elegir algunas): Niebla n Máscaras de textura n Transparencias

Trabajos Prácticos n Mundos virtuales (elegir algunas): Niebla n Máscaras de textura n Transparencias n Reflejos y/o environment mapping n Sombras n Sistemas de partículas n Modelos 3 D n 54

Trabajos Prácticos n Otros: Heightmap (niveles) n Sombras n Modelos animados n Colisiones n

Trabajos Prácticos n Otros: Heightmap (niveles) n Sombras n Modelos animados n Colisiones n Skyboxes n Efectos de partículas n Técnicas + DOC n 55

Próximos pasos n En la web: (próximamente) n n Busquen (o nos piden): n

Próximos pasos n En la web: (próximamente) n n Busquen (o nos piden): n n Recursos (3 ds, bsp, MD 3) En Diciembre: n n Tutoriales y ejemplos. Lista de trabajos posibles para realizar. Links de interés. Definición de que trabajo van a realizar. Consultas vía MAIL (claridad e info): n n jpdamato@exa. unicen. edu. ar cristian. GB@gmail. com 56