Upload
maria-andrea
View
180
Download
2
Embed Size (px)
Citation preview
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 1/34
Gráficas Computacionales
OpenGL
ITESM-CEM Departamento de Ciencias Computacionales
Contenido
Historia
Metas de Diseño de OpenGL
Estructura de un Programa
Primitivas de Dibujo y Polígonos Interpolación Lineal de Color
Propiedades de Puntos, Líneas, etc.
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 2/34
Historia
Recuerda el proceso de síntesis: Transforma geometría (objeto ->mundo,
mundo ->ojo)
Aplica proyección de perspectiva (ojo ->pantalla)
Recorta al fustrum de vista
Procesa superficies visibles (Z-buffer)
Calcula iluminación de superficie
Implementar todo este proceso esmucho trabajo
Historia
En 1982 Silicon Grahics (SGI) revolucionalas estaciones de trabajo gráficasimplementando el proceso de síntesis en“hardware”.
Los programadores de aplicacionesusaban una librería llamada GL parautilizar el sistema.
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 3/34
Historia
Con GL era relativamente simpleprogramar aplicaciones 3-D interactivas,así que su éxito lleva a la creación deOpenGL en 1992.
Metas de Diseño de OpenGL
SGI diseñó OpenGL para lograr un APIgráfico: Con cierta independencia del “hardware”
Natural y compacto
Fácil de usar Suficientemente cercano al “hardware”, para tener
un excelente desempeño (usando aceleración por“hardware”)
Enfocado en el dibujo (“render”)
Independiente de cualquier sistemas de ventanas
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 4/34
Metas de Diseño de OpenGL
Para usarse con C y C++ (pero que también puedeusarse con Java, Visual Basic, etc.)
Estándar gratuito y con código abierto
Controlado y revisado por un consejo que incluye aSGI, Microsoft, Nvidia, HP, 3DLabs, IBM, etc.
Muy estable
Extensible (su evolución refleja las nuevascapacidades del “hardware”)
Lo que OpenGL hace
OpenGL se ha vuelto un estándar pues:No trata de hacer demasiadas cosas
Sólo dibuja la imagen, no maneja ventanas, modelado,sonido o animación de alto nivel
Hace lo suficiente
Efectos útiles de síntesis con alto rendimientoDibuja ObjetosVe ObjetosEspecifica modelos de colorAplica IluminaciónMejora ImágenesManipula Bitmaps e ImágenesMapea Texturas
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 5/34
OpenGL para el Programador
Aplicación
Paquete de GráficasAplicación
API de OpenGL
Hardware y Software
Dispositivos de Entrada Dispositivos de Salida
OpenGL Rendering Pipeline
La mayor parte de las implementaciones de OpenGLsiguen un mismo orden en sus operaciones, lo que seconoce como “rendering pipeline” de OpenGL
Geometry
PrimitiveOperations
Pixel
Operations
Scan
Conversion
Texture
Memory
Fragment
Operations
F r a m e b uf f e r
Vertex
Images
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 6/34
Librerías de OpenGL
OpenGL Core Library OpenGL32 en Windows
Provee principalmente funcionalidad pararealizar el “rendering”
OpenGL Utility Library (GLU) Provee funcionalidad de una nivel más alto
que utiliza los comandos de bajo nivel de
OpenGL Proyecciones, superficies, etc.
Librerías de OpenGL
OpenGL Utility Toolkit (GLUT)
Provee capacidades básicas de ventanas
Utilizado para el manejo de eventos de entrada:
Mouse, teclado, meús
Rutinas “callback”
Interface común para múltiples plataformas (puedenportarse entre X Windows y MS Windows e inclusiveMac)
GLUT no tiene todo (no hay deslizadores (sliders), cajasde diálogo, barras de menu (menu bar) bar, etc.)
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 7/34
Librerías de OpenGL
Estructura de un Programa
1. Configura y abre ventana (GLUT)2. Registra funciones de captura de eventos
(callback GLUT) Dibuja (render)
Cambia de tamaño (Resize) Entrada: teclado, ratón, etc.
3. Entra en el ciclo de procesamiento deeventos (GLUT)
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 8/34
Programa Sencillo
Dibujar un cuadro blanco en una ventanade fondo negro
simple1.c
#include <GL/gl.h>#include <GL/glu.h>#include <GL/glut.h>
void myDisplay(){glClear(GL_COLOR_BUFFER_BIT);glBegin(GL_POLYGON);
glVertex2f(-0.5, -0.5);
glVertex2f(0.5,-0.5);glVertex2f(0.5, 0.5);glVertex2f(0.5, -0.5);
glEnd();glFlush();
}int main(){
glutCreateWindow("simple1");glutDisplayFunc(myDisplay);glutMainLoop();
}
1. Creación de una ventana
2. Registro de la función“callback” de exposición
(“display”)
3. Entrada al ciclo de eventos
Función “callback” de dibujo
(corregir error)
Librería necesaria
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 9/34
#include
La mayoría de los elementos (funciones,constantes, tipos de datos) están definidasen los archivos:
gl.h, glu.h y glut.h
Nota: glut.h incluye automáticamente a las otras
Ejemplos de elementos definidos:
Funciones: glBegin, glClear, …
Constantes: GL_POLYGON, …
Tipos de datos: Glfloat, Gldouble, …
Ciclo de Eventos
La función principal (main) siempre termina conel programa introduciéndose en un ciclo infinitode eventos: glutMainLoop()
Casi todos los programas de ventanas estánbasados en eventos. Así, no se realiza ningunaacción hasta que sucede un evento quedesencadena una acción (“callback”).
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 10/34
Funciones de Callback
En el ejemplo se registra una función“callback” de desplegado: myDisplay()
Esta función “callback” será llamada cadavez que sea necesario refrescar lospixeles de la ventana
La función “callback” termina con un
glFlush() (que obliga a ejecutar cualquierinstrucción que haya quedado pendiente)
Algunas Primitivas de Dibujo
PuntosGL_POINTS
LíneasGL_LINESGL_LINE_STRIPGL_LINE_LOOP
FormasGL_TRIANGLESGL_TRIANGLE_STRIPGL_TRIANGLE_FANGL_POLYGONGL_QUAD_STRIP
Objetos 3D
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 11/34
Puntos y Líneas (ver simple3.c)
Formas (ver simple4.c)
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 12/34
Objetos 3-D
Cube Sphere
Teapot
Polígonos
OpenGL desplegará correctamente únicamentepolígonos que cumplan con ser:
Simples
Convexos
Planos
El programa del usuario debe verificar que loanterior se cumpla
Nota: Los triángulos satisfacen todas estascondiciones
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 13/34
Polígonos Simples
Las aristas no se cruzan
Polígonos Convexos
Todos los puntos en un segmento de líneaentre dos puntos dentro del polígonoquedarán también dentro del polígono
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 14/34
Polígonos Planos
Todos los vértices están dentro del mismoplano
Polígonos: Front/Back
Cada polígono tiene 2 lados: frente y tras
OpenGL puede dibujarlos de maneradistinta
El órden de los vértices en la listadetermina cuál es el frente, en 3-D:
En el frente los vértices van contra el reloj(regla de la mano derecha)
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 15/34
Visualizar en 3D
X
Y
Z
z=1.0
x=1.0
y=1.0
A B
CD
E F
GH
Contra Reloj
Ejemplo: dibujar una caja
Se dibujan las 6 caras como polígonos
Cada car se especifíca como lista de vértices
Los vértices se especifícan ¡contra reloj!
A B
CD
E F
GHGLdouble size = 1.0;
glBegin(GL_POLYGON); // cara de frenteglVertex3d(0.0, 0.0, size);glVertex3d(size, 0.0, size);glVertex3d(size, size, size);glVertex3d(0.0, size, size);
glEnd();
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 16/34
Ejemplo: con cuadriláteros
Cuadriláteros:glBegin(GL_QUADS);
glVertex3f(-1, 1, 0);
glVertex3f(-1, -1, 0);
glVertex3f(1, -1, 0);
glVertex3f(1, 1, 0);
glEnd();
Este tipo de operaciones se conoce comoimmediate-mode rendering ; cada comando seejecuta de inmediato
Ejemplo: con triángulos
Triángulos:float v1[3], v2[3], v3[3], v4[3];
...
glBegin(GL_TRIANGLES);
glVertex3fv(v1); glVertex3fv(v2); glVertex3fv(v3);glVertex3fv(v1); glVertex3fv(v3); glVertex3fv(v4);
glEnd();
Cada 3 vertices forma un triángulo
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 17/34
Ejemplo: con tiras de triángulos
Una primitiva OpenGL triangle strip reduce redundancia
compartiendo vértices:
glBegin(GL_TRIANGLE_STRIP);
glVertex3fv(v0);
glVertex3fv(v1);
glVertex3fv(v2);
glVertex3fv(v3);
glVertex3fv(v4);
glVertex3fv(v5);
glEnd();
triángulo 0 es v0, v1, v2 triángulo 1 es v2, v1, v3 (¿por qué no v1, v2, v3? )
triángulo 2 es v2, v3, v4
triángulo 3 es v4, v3, v5
v0
v2
v1
v3
v4
v5
OpenGL: Máquina de Estados
Hay estados por omisión (“default”) para todo
Los estados internos de OpenGL no cambian hastaque uno los cambia
Se pueden cambiar los estados de dibujo (“render”),ejemplo:
glPointSize(4.0);
Se pueden recuperar los estados actuales, ejemplo:
glGetFloat(GL_POINT_SIZE_RANGE, sizes);
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 18/34
OpenGL no es OO
OpenGL no es Orientado a Objetos
Lo que existe son múltiples funciones parauna operación lógica, por ejemplo:
glVertex3f
glVertex2i
glVertex3dv
Nombres de Funciones
Las funciones de OpenGL siguen unaconvención de nombre que se refiere a:
A qué librería pertenece dicha función
El nombre de la función, y
El número y tipo de los argumentos que recibe
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 19/34
Nombres de Funciones
glVertex3f v(p)El argumento es un
apuntador a un arreglo
glColor3f (x,y,z)Pertenece a la
librería GL
Nombre de laFunción
Número deargumentos
Tipo deargumentos
Tipos de Datos
OpenGL define sus propios tipos de datos,para portar código de una plataforma aotra de manera fácil
Todos los tipos de datos empiezan con GLpara denotar que vienen de la libreríaOpenGL, seguidos del tipo de datocorrespondiente a C
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 20/34
Tipos de Datos
Tipos de Datos
u denota un tipo de dato sin signo
size el valor de longitud o profundidad
clamp es usado para la composición ycolocación de la amplitud del color
boolean indica condiciones de verdaderoo falso
enum variables enumeradas
bitfield variables de campos de bits
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 21/34
Defaults
GLUT provee valores por definición (“default”) paracámaras, colores, parámetros de la ventana, etc.
simple1.c hace uso de los valores por omisón(“default”); de ahí su sencillez
Ahora haremos cambios en diferentes propiedades de:Ventana
Colores
Vistas
simple2.c
#include <GL/glut.h>
int main( ){
glutInitDisplayMode(GLUT_RGB);glutInitWindowSize(300,300);glutInitWindowPosition(0,0);
glutCreateWindow("simple2");glutDisplayFunc(myDisplay);
initializeGL();
glutMainLoop();}
Definición de propiedades de la ventana
Inicialización de propiedades(nuestra función)
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 22/34
Propiedades de la Ventana
glutInitDisplayMode Color RGB
glutWindowSizeTamaño en pixeles
glutWindowPosition Posición de la esquina superior izquierda
glutCreateWindow Creación dando el título “simple2”
Inicialización
void initializeGL()
{
glClearColor (0.0, 0.0, 0.0, 1.0);
glColor3f(1.0, 1.0, 1.0);
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
gluOrtho2D(-1.0, 1.0, -1.0, 1.0);
}
Color negro de fondoOpaco
Color blanco para pintar
Vista
Inicialización de la matriz de la vista
Dibujo en 2D
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 23/34
Sistemas Coordenados
No se tiene que usar toda la ventana paramostrar (“display”) la imagen: glViewport(x,y,width,height)
x, y: definen la esquina inferior izquierda
width, height: el ancho y alto
parámetros en pixeles
Atributos
Los atributos son:
Parte de la librería OpenGL
Determinan la apariencia de los objetos
Ejemplos
Color (puntos, líneas, polígonos) Tamaño y ancho (puntos, líneas)
Patrones (líneas, polígonos)
Modo poligonal
Desplegado relleno
Desplegado sólo de aristas
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 24/34
Atributos -- Color
glColor3f(Glfloat rojo, Glfloat verde, Glfloat azul)
Atributos basados en Vértices
glBegin(GL_POLYGON);glColor3f(1.0, 1.0, 1.0); // blanco
glVertex2f(-0.5, -0.5);
glColor3f(1.0, 0.0, 0.0); // rojo
glVertex2f(-0.5, 0.5);
glColor3f(0.0, 0.0, 1.0); // azul
glVertex2f( 0.5, 0.5);
glColor3f(1.0, 0.0, 1.0); // morado
glVertex2f( 0.5, -0.5);
glEnd();
ver simple5.c
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 25/34
Interpolación Lineal
glBegin(GL_LINES);
glColor3f(1.0, 0.0, 0.0); // rojo
glVertex2f( 0, 0);
glColor3f(0.0, 0.0, 1.0); // azul
glVertex2f( 1, 0);
glEnd();
Interpolación Lineal
Interpolar significa estimar el valor de unafunción o una serie entre dos valores conocidos.
La interpolación lineal supone:
Que conoces dos valores particulares (colores en lospuntos extremos)
Que quieres conocer el valor en un punto intermedioentre esos dos valores conocidos (color intermedio)
Que el proceso cambio a razón constante
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 26/34
Segmentos Paramétricos
La parametrización puede utilizarse paracambiar o moverse entre dos posiciones
Segmento de línea entre v1 y v2:
v(u) = (1 – u) v1 + (u) v2
0 ≤ u ≤ 1
Interpolación Lineal de Color
Color en v1 : c1 = [1, 0, 0]
Color en v2 : c2 = [0, 0, 1]
Color en v(u) : c(u) = (1 – u) c1 + (u) c2
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 27/34
Polígonos Vecinos
?
Polígonos Vecinos
incorrecto
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 28/34
?
Polígonos Vecinos
correcto
Polígonos Vecinos
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 29/34
correcto
Polígonos Vecinos
Transparencia
Conocida como el canal Alfa del color,determina que tanto se puede ver a través delobjeto
El color necesita 4 componentes ahora:
glColor4f(R, G, B, Alfa);
El parámetro alpha cambia el nivel de opacidadglColor4f(R, G, B, 1.0); // opacoglColor4f(R, G, B, 0.0); // transparenteglColor4f(R, G, B, 0.5); // semi-transparente
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 30/34
Transparencia
Se necesita habilitar la mezcla detransparecia:glEnable(GL_BLENDING)
Además, se necesita cambiar el métodode mezcla con:glBlendFunc(GL_SRC_ALPHA,
GL_ONE_MINUS_SRC_ALPHA)
Esto hace que la función sea controlada por elcuarto canal del color que es alfa
Transparente Parcial
habilitar mezcla de transparencia
glEnable(GL_BLEND);
cambiar el modo de mezcla
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
glBegin(GL_LINES);
glColor4f(0, 1.0, 0, 1.0); verde opaco
glVertex2f(0.0, 0.0);
glColor4f(0, 1.0, 0, 0.0); verde transparente
glVertex2f(1.0, 0.0);
glEnd();
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 31/34
ver simple7.c
Transparente Parcial
Modelos de Sombreado
El modo por default es el sombreadosuave (“smooth shading”)
glShadeModel(GL_SMOOTH)
OpenGL interpola los colores en losvértices a través del polígono
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 32/34
Modelos de Sombreado
Otro modo es el sombreado plano (“flat shading”)
glShadeModel(GL_FLAT)
El color del primer vértice determina el color derelleno de todo el polígono
Modo de Dibujo de Líneas
El modo por default es “jagged lines”
glDisable(GL_LINE_SMOOTH)
Rápido de calcular, pero no se ve bien
50x de aumento:
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 33/34
Líneas Suaves – Anti-Aliasing
Puede habilitarse el modo de dibujo suavepara líneas
glEnable(GL_LINE_SMOOTH)
Más lento de calcular, pero se ve mejor
50x de aumento:
Material elaborado por:
Isaac Rudomín [email protected]
Erik Millán [email protected]
Ma.Elena Melón [email protected]
5/12/2018 1.2a OpenGL - slidepdf.com
http://slidepdf.com/reader/full/12a-opengl 34/34
Material suplementario yExpositor:
José Luis Gordillo