UNIVERSIDAD TECNOLÓGICA DE PANAMÁ

FACULTAD DE INGENIERÍA DE SISTEMAS

COMPUTACIONALES

DEPARTAMENTO DE COMPUTACIÓN Y SIMULACIÓN

DE SISTEMAS

CARRERA LICENCIATURA EN INGENIERÍA DE SOFTWARE

INTRODUCCIÓN A LA TEORÍA COMPUTACIONAL

Laboratorio # 2
Título de la Experiencia: Módulo 1: Manejo de elementos gráficos en entornos
digitales.

Integrantes:
Ahir, Vivek 20-39-4171
Camargo, Héctor 8-951-641
Clark, Jaime 8-954-1835
Meneses, Jomaris 8-956-760
Morales, Isaac 8-954-2141
Villamil, Samuel 8-945-1805

Profesor:
Ing. Samuel Jiménez

SEMESTRE II, 2020

 UNIVERSIDAD TECNOLÓGICA DE PANAMÁ
FACULTAD DE INGENIERÍA DE SISTEMAS COMPUTACIONALES
DEPARTAMENTO DE COMPUTACIÓN Y SIMULACIÓN DE SISTEMAS
LABORATORIO # 2
FC-FISC-1-8-2016
Facilitador: Ing. Samuel Jiménez Asignatura: Herramientas de Computación Gráfica
Integrantes: Fecha: Semana del 31 – 4 de Septiembre

A. TÍTULO DE LA EXPERIENCIA: Módulo 1: Manejo de elementos gráficos en

entornos digitales.

B. TEMAS:
• Primitivas básicas en OpenGL

C. OBJETIVO(S):
• Conocer las herramientas fundamentales de OpenGl para el dibujo de primitivas
básicas.
• Presentar las funciones principales de OpenGl que nos permite el dibujo de líneas,
círculos, cuadros aplicando los patrones esenciales.
• Utilizar correctamente los colores dentro del entorno gráfico.
• Manejar correctamente el rellenado de figuras dentro de OpenGL.
D. METODOLOGÍA:
✓ Fomentar el trabajo en equipo.
✓ Incentivar y estimular el aprendizaje activo del alumno a través de actividades
de búsqueda de información, realización y exposición de trabajos individuales o
en grupo.
✓ Establecer espacios de aprendizaje que fomenten la convivencia, al compartir
experiencias unos con otros.
✓ Desarrollo de la capacidad del pensamiento crítico.
✓ Reflexión sobre sí mismo y el propio aprendizaje.

E. PROCEDIMIENTO O ENUNCIADO DE LA EXPERIENCIA:

El laboratorio presenta los siguientes detalles:
• Trabajar en los grupos conformados.
• Se entregará el laboratorio por la plataforma virtual el día especificado por el
profesor. No se aceptará más entrega después de la fecha establecida. (Procuren
entregar a tiempo)
• Seguir cada una de las indicaciones que se presente.
• Contestar a las preguntas estipuladas en el informe.
• Plasme la imagen de lo que va observando en su trabajo.
Copie en CodeBlocks el código proporcionado por el profesor titulado “laboratorio 2.1” y
conteste las siguientes interrogantes:

2
 UNIVERSIDAD TECNOLÓGICA DE PANAMÁ
FACULTAD DE INGENIERÍA DE SISTEMAS COMPUTACIONALES
DEPARTAMENTO DE COMPUTACIÓN Y SIMULACIÓN DE SISTEMAS
LABORATORIO # 2
FC-FISC-1-8-2016
OJO: primero ejecute el programa original establecido por el profesor y luego realice
las modificaciones que se le pide dentro del programa original. Las primeras
modificaciones es del laboratorio 2.1

1. Realice las siguientes modificaciones en la función void proyección

void proyeccion()
{
glMatrixMode(GL_PROJECTION);
gluOrtho2D(-15,15,-5,5);
glClearColor(0.5,0.5,0.0,0.0);
}

Ejecute el programa, ¿Explique lo que sucede?

Original Modificado

Al realizar los cambios se modificó el color del fondo a un color más claro y la base del
triángulo de redujo.
2. Realice la siguiente modificación a la función void Triangulo:
void Triangulo()
{
glClear(GL_COLOR_BUFFER_BIT);
glColor3f(1.0,1.0,0.0);
glBegin(GL_LINES);
glVertex2i(1.5,2);
glVertex2i(-1,-1);

3
 UNIVERSIDAD TECNOLÓGICA DE PANAMÁ
FACULTAD DE INGENIERÍA DE SISTEMAS COMPUTACIONALES
DEPARTAMENTO DE COMPUTACIÓN Y SIMULACIÓN DE SISTEMAS
LABORATORIO # 2
FC-FISC-1-8-2016
glVertex2i(-1,-1);
glVertex2i(3,-1);
glVertex2i(3,-1);
glVertex2i(1.5,2);
glEnd();
glFlush();
}
Ejecute el programa, ¿Explique lo que sucede?
Antes Después

Al realizar los cambios al código se modificó el color de las líneas que forman el triángulo,
cambiaron de verdes a amarillas.
3. Procedamos a cambiar los rangos de la función void proyección, tal como estaba
antes de hacer las modificaciones al programa:
void proyeccion()
{
glMatrixMode(GL_PROJECTION);
gluOrtho2D(-5,5,-5,5);
glClearColor(0.0,0.0,0.0,0.0);
}

Ahora procedamos a establecer los siguiente argumentos en la función

void Triangulo():
{

4
 UNIVERSIDAD TECNOLÓGICA DE PANAMÁ
FACULTAD DE INGENIERÍA DE SISTEMAS COMPUTACIONALES
DEPARTAMENTO DE COMPUTACIÓN Y SIMULACIÓN DE SISTEMAS
LABORATORIO # 2
FC-FISC-1-8-2016
glClear(GL_COLOR_BUFFER_BIT);
glColor3f(0.0,1.0,0.0);
glEnable (GL_LINE_SMOOTH);
glBegin (GL_LINES);
glVertex3f (0.0f, 0.0f, 0.0f);
glVertex3f (1.0f, 0.0f, 0.0f);
glVertex3f (0.0f, 0.0f, 0.0f);
glVertex3f (0.0f, 1.0f, 0.0f);
glVertex3f (0.0f, 0.0f, 0.0f);
glVertex3f (0.0f, 0.0f, 1.0f);
glEnd(); glFlush();
}
Ejecute el programa, ¿Explique lo que sucede?
Antes Después

Al realizar los cambios al código cambió el color del fondo a negro y ahora la figura que se
forma es una L.
4. Establezca los siguiente argumentos en la función void Triangulo():
{
glClear(GL_COLOR_BUFFER_BIT);
glColor3f(0.0,1.0,0.0);
glLineWidth(8.0);
glBegin(GL_LINES);
glVertex3f(0.0f,0.0f,0.0f);

5
 UNIVERSIDAD TECNOLÓGICA DE PANAMÁ
FACULTAD DE INGENIERÍA DE SISTEMAS COMPUTACIONALES
DEPARTAMENTO DE COMPUTACIÓN Y SIMULACIÓN DE SISTEMAS
LABORATORIO # 2
FC-FISC-1-8-2016
glVertex3f(1.0f,0.0f,0.0f);
glVertex3f(1.0f,1.0f,0.0f);
glVertex3f(0.0f,1.0f,0.0f);
glVertex3f (0.0f,0.0f,0.0f);
glEnd();
glFlush();
}
Ejecute el programa, ¿Explique lo que sucede?
Antes Después

Al realizar los cambios al código se hicieron más gruesas las líneas y se colocaron de
forma paralela.
5. Establezca los siguiente argumentos en la función void Triangulo():
{
glClear(GL_COLOR_BUFFER_BIT);
glColor3f(0.0,1.0,0.0);
glBegin(GL_LINE_LOOP);
glVertex3f(0.0f,0.0f,0.0f);
glVertex3f(1.0f,0.0f,0.0f);
glVertex3f(1.0f,1.0f,0.0f);
glVertex3f(0.0f,1.0f,0.0f);
glEnd();
glFlush();
}

6
 UNIVERSIDAD TECNOLÓGICA DE PANAMÁ
FACULTAD DE INGENIERÍA DE SISTEMAS COMPUTACIONALES
DEPARTAMENTO DE COMPUTACIÓN Y SIMULACIÓN DE SISTEMAS
LABORATORIO # 2
FC-FISC-1-8-2016
Ejecute el programa, ¿Explique lo que sucede?

Al realizar los cambios al código se cambió el grosor de las líneas y la figura que se forma
es cuadrado.
6. Establezca los siguiente argumentos en la función void Triangulo():
{
glClear(GL_COLOR_BUFFER_BIT);
glColor3f(0.0,1.0,0.0);
glBegin(GL_TRIANGLE_STRIP);
glVertex3f(0.0f,0.0f,0.0f);
glVertex3f(1.0f,0.0f,0.0f);
glVertex3f(0.0f,1.0f,0.0f);
glVertex3f(1.0f,1.0f,0.0f);
glEnd();
glFlush();
}

7
 UNIVERSIDAD TECNOLÓGICA DE PANAMÁ
FACULTAD DE INGENIERÍA DE SISTEMAS COMPUTACIONALES
DEPARTAMENTO DE COMPUTACIÓN Y SIMULACIÓN DE SISTEMAS
LABORATORIO # 2
FC-FISC-1-8-2016
Ejecute el programa, ¿Explique lo que sucede?

Al realizar los cambios al código se rellenó el interior de la figura

7. Al terminar, ejecute el siguiente programa que se encuentra en la plataforma

denominado “laboratorio 2.2”:
¿Explique lo que sucede?

Al ejecutar el código 2.2 se generó un círculo de líneas gruesas de color blanco.

8. Realice las modificaciones en la función void display:

glClear(GL_COLOR_BUFFER_BIT);
glColor3f(1.0,0.0,1.0);
glPointSize(2.0);
glBegin(GL_POINTS);

8
 UNIVERSIDAD TECNOLÓGICA DE PANAMÁ
FACULTAD DE INGENIERÍA DE SISTEMAS COMPUTACIONALES
DEPARTAMENTO DE COMPUTACIÓN Y SIMULACIÓN DE SISTEMAS
LABORATORIO # 2
FC-FISC-1-8-2016
¿Explique lo que sucede?

Antes Después

Al realizar los cambios en el código el color de las líneas cambió de blanco a morado y el
grosor de las líneas se redujo.

9. Ejecute el siguiente programa que se encuentra en la plataforma denominado

“laboratorio 2.3”
¿Explique lo que sucede?

En la ejecución del código 2.3 se combinaron los dos códigos anteriores ya que podemos
ver todas las figuras formadas anteriormente en una sola ventana.

Perfecto, ya están listo para Trabajar en su taller 2 y laboratorio 2

9
 UNIVERSIDAD TECNOLÓGICA DE PANAMÁ
FACULTAD DE INGENIERÍA DE SISTEMAS COMPUTACIONALES
DEPARTAMENTO DE COMPUTACIÓN Y SIMULACIÓN DE SISTEMAS
LABORATORIO # 2
FC-FISC-1-8-2016
10. Dificultades encontradas:
En este laboratorio no encontramos ninguna dificultad.
11. ¿Qué aprendió en esta asignación?

Aprendimos a imprimir nuevas figuras como círculos y triángulos.

Laboratorio 2: De acuerdo con lo aprendido en clase, utilizando las primitivas básicas

dibujaran en OpenGL el diseño de una casa o edificio con sus respectivas ventanas.

Diseño para crear en OpenGL

10