SlideShare ist ein Scribd-Unternehmen logo
1 von 32
Downloaden Sie, um offline zu lesen
Akademy-es 2011

Introducción a las librerías
   Pygame y PyOpenGL
¿Qué necesitamos?(1)

La presentación:
 goo.gl/3psq1


   El código:
goo.gl/6AD1A
¿Qué necesitamos?(2)

● Tener Python instalado en nuestro sistema. Por lo general
  viene incluido en prácticamente todas las distros de Linux
  populares.
● Tener instaladas las librerías Pygame y PyOpenGL

 Ejemplo en Ubuntu:
       ● sudo apt-get install python-pygame python-opengl freeglut3-dev
                                       ●
● O usando las setuptools de Python:
●
                         ● sudo easy_install pygame
                         ● sudo easy_install pyopengl
¿Qué son Pygame y PyOpenGL?

                Ambas son librerías gráficas




● procesado de gráficos 2D   ● Manejo de gráficos 3D
● Gestor de ventanas         ● Procesamiento matemático
● Manejo de eventos            3D interno
● Sonido
● ...
Nuestros Objetivos

Conseguir crear un pequeño programa en python que use
                  pygame y pyopengl
Inclusiones

#Importamos las nuevas librerias
import pygame
from pygame.locals import *

from OpenGL.GL import *
from OpenGL.GLU import *
from OpenGL.GL.shaders import *

#Definimos el ancho y largo de nuestra ventana
WIDTH = 600
HEIGHT = 600
Inicializando Pygame

def init():
  #inicializamos pygame
  pygame.init()

  #creamos una pantalla de WIDTHxHEIGHT pixeles que use doblebuffer,
  #que se pueda redimensionar y que acepte opengl
  flags = DOUBLEBUF|OPENGL
  screen = pygame.display.set_mode((WIDTH, HEIGHT), flags)
El método main(1)
El método main(2)

#Metodo main
def main():
  running = True
  init()

  while running:
    for event in pygame.event.get():
       if event.type == QUIT:
          running = False

  pygame.quit()

#Llamamos al metodo main
main()
La función init_gl

def init_gl():
  #Cada vez que se dibuja la escena esta se borra enteramente
  #glClearColor y ClearDepth definen el color y la profundidad
  #del borrado
  glClearColor(0.0,0.0,0.0,1.0);
  glClearDepth(1.0);
La función resize_glscene

def resize_glscene(w,h):
  #Especifica el tamaño de la ventana para OPENGL
  #Aunque la ventana física tenga ciertas dimensiones
  #podemos hacer que las de OpenGL no coincidan con
  #estas.
  glViewport(0,0,w,h);

  #Se establece la matriz de proyeccion como la identidad
  glMatrixMode(GL_PROJECTION);
  glLoadIdentity();

  gluPerspective(45.0, float(w)/float(h), 0.1, 100.0);

  #Se establece la matriz de modelado como la identidad
  glMatrixMode(GL_MODELVIEW);
  glLoadIdentity();
Dibujando la escena
                                La función draw_scene(1)
vertices = (GLfloat * (4*4))(
  1.0, 1.0, 0.0, 1.0,
  1.0,-1.0, 0.0, 1.0,
  -1.0,-1.0, 0.0, 1.0,
  -1.0, 1.0, 0.0, 1.0)

def draw_scene():
  #Limpiamos la pantalla
  glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

  #Colocamos la matriz identidad
  glLoadIdentity();
  #Movemos en el eje Z (profundidad) 6 puntos hacia atras
  glTranslatef(0.0, 0.0, -6.0);
Dibujando la escena:
             Definiendo tipos en Python(1)
● Definiremos una variable de un tipo determinado tal y como
  lo haríamos en C
● Al igual que hacemos en C podemos crear arrays de esos
  tipos
● ¿Por qué hacer esto?
  PyOpenGL sólo acepta parámetros dados de esta forma
  en algunas de sus funciones
Dibujando la escena:
Definiendo tipos en Python(2)




               Nota:
               En C sería algo como
               GLfloat vertices[4*4]
Coordenadas Homogéneas

Todo punto del espacio con coordenadas (x,y,z) se puede
expresar en coordenadas homogéneas como (x,y,z,1)

Estas tienen su utilidad ya que la mayoría de los cambios
sobre los puntos como rotaciones, traslaciones,... se expresan
como matrices 4x4

                  Click para más información
El código siguiente puede no funcionar
 dependiendo de la tarjeta gráfica que
    se tenga o los drivers instalados
Dibujando la escena:
                                   La función draw_scene(2)
  #Pasa a OpenGL los datos almacenados en vertices y le asignamos
  #el identificador 0
  glVertexAttribPointer(0, 4, GL_FLOAT, 1, 0, vertices);
  #Activamos este atributo con identificador 0
  glEnableVertexAttribArray(0);

  #Dibujamos, usando cuadrados, los vertices en el orden 0,1,2,3
  glDrawElements(GL_QUADS, len(faceIndex), GL_UNSIGNED_SHORT, faceIndex);

  #Desactivamos este atributo
  glDisableVertexAttribArray(0);

...
def main():
  ...
  #Le decimos al programa que en el identificador 0 posicionaremos
  #los datos para la variable "position" del shader
  glBindAttribLocation(program, 0, "position");
  ...
Dibujando la escena:
La función glVertexAttribPointer
Dibujando la escena:
La función glDrawElements
¿Qué son los shaders?

 ● A groso modo son programas que se ejecutan en la
   GPU
 ● Existen varios lenguajes de alto nivel para programar
   Shaders. Por ejemplo:
    ○ GLSL (OpenGL Shading Language, desarrollado por
      el grupo Khronos)
    ○ HLSL (High Level Shading Language, desrrollado por
      Microsoft)
    ○ Cg (C for Graphics, desarrollado por Nvidia)

Nosotros centraremos en GLSL
Estructura de un programa en GLSL

Tendremos dos fuentes distintos:



Tipos de datos definidos:
             float, vec3, vec4, mat4,...

Tipos de entrada/salida de datos:
            attribute, uniform y varying
El Vertex Shader

● Opera sobre cada vértice
● Control total sobre lo que pasa
  en los vértices
● Se usa para:
   ○ Transformaciones en los
      vértices (Rotaciones,
      traslaciones, ...)
   ○ Transformaciones en las
      normales
   ○ Iluminación
   ○ Coordenadas de las
      texturas
   ○ ...
El Fragment Shader

● Opera sobre cada pixel (No los
  de la pantalla, sino de los de
  cada figura)
● Se usa para:
   ○ Controlar los efectos sobre
      la imagen
   ○ Iluminación y sombras
   ○ ...
Attributes, Uniforms y varyings

● Attributes:
  Son datos de entrada y salida que varían para cada vértice en
  cada rendering.
  Por ejemplo: Las coordenadas de los vertices o las normales son
  específicas de cada vértice
● Uniforms:
  Son datos de entrada y salida que se mantienen iguales para
  todos los vértices en cada rendering.
  Por ejemplo: la posición de una luz, una cierta matriz de
  transformaciones que queramos aplicar a todos los vértices,...
● Varyings:
  Son usados para comunicar datos entre el Vertex Shader y el
  Fragment Shader.
  Son variables de únicamente lectura en el FS y de lectura y
  escritura en el VS.
  Además han de ser declarados tanto en el VS como en el FS
Creación de un programa:
          Pasos a seguir
Creación de un programa:
                       función load_shaders (1)
def load_Shaders(vsFileName, fsFileName):
    #creamos un identificador del programa
    program = glCreateProgram();

    #leemos el contenido de los ficheros
    vsSource = open(vsFileName, 'r').read()
    fsSource = open(fsFileName, 'r').read()

    #creamos unos identificadores de los shaders y les
    #asociamos su codigo
    vsShader = glCreateShader(GL_VERTEX_SHADER);   #Vertex Shader
    glShaderSource(vsShader, vsSource);

    fsShader = glCreateShader(GL_FRAGMENT_SHADER); #Fragment
Shader
    glShaderSource(fsShader, fsSource);
Creación de un programa:
                   función load_shaders (2)
#Compilamos los shaders
glCompileShader(vsShader);
glCompileShader(fsShader);

#Adjuntamos los shaders al programa
glAttachShader(program, vsShader);
glAttachShader(program, fsShader);

#Enlazamos el programa
glLinkProgram(program);

return program
Escribiendo el Vertex Shader

void main() {
  gl_Position = gl_ModelViewProjectionMatrix * gl_Vertex;

}


    ● Siempre debemos escribir en el VS el valor de gl_Position
      Define la posición final del vértice
    ● gl_ModelViewProjectionMatrix aplica las matrices de
      proyección y modelado.
      La de proyección viene dada en resize_glscene, la de
      modelado ha cambiado a lo largo del programa
    ● gl_Vertex toma los valores dados en el canal 0 de
      glVertexAttribPointer
Escribiendo el Fragment Shader

void main() {
  gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);
}


   ● Siempre debemos escribir en el FS el valor de gl_FragColor.
     Define el color final del pixel o fragmento.
   ● Lo coloreamos con el valor (1.0,1.0,1.0,1.0) que es blanco
     en RGBA
La importancia de las funciones
                    glGet(Attrib/Uniform)Location
Problema: Al cambiar el índice en glVertexAttribArray deja de
dibujar el cuadrado.
Solución: Dejar la elección del índice a OpenGL
def main():
  ...
  #Solicitamos la posición de la variable "position"
  position = glGetAttribLocation(program, "position");
  #Se la asignamos con bind
  glBindAttribLocation(program, position, "position");


def draw_scene(position):
  ...
  glVertexAttribPointer(position, 4, GL_FLOAT, 1, 0, vertices);
  glEnableVertexAttribArray(position);
  glDisabelVertexAttribArray(position);
Tareas pendientes

● Añadir en el VS la variable de atributo de position
● ¿Como localizar la posición de las variables Uniforms?
● Hacer algo más divertido que un cuadrado

                Ampliando conocimientos:
                      goo.gl/2yXhc
¡GRACIAS POR VENIR!

     Nos vemos en Twitter!




                        Aarón Negrín Santamaría

Weitere ähnliche Inhalte

Was ist angesagt?

redes neuronales Kohonen
redes neuronales Kohonenredes neuronales Kohonen
redes neuronales Kohonen
ESCOM
 
Algoritmos y estructuras de datos en Python - digital.pdf
Algoritmos y estructuras de datos en Python - digital.pdfAlgoritmos y estructuras de datos en Python - digital.pdf
Algoritmos y estructuras de datos en Python - digital.pdf
Sirley43
 
U1 Analisis Algoritmos Complejidad
U1 Analisis Algoritmos ComplejidadU1 Analisis Algoritmos Complejidad
U1 Analisis Algoritmos Complejidad
rezzaca
 
Las 4 P en el desarrollo de software
Las 4 P en el desarrollo de softwareLas 4 P en el desarrollo de software
Las 4 P en el desarrollo de software
Sofylutqm
 
Equipo 6 programacion hibrida
Equipo 6 programacion hibridaEquipo 6 programacion hibrida
Equipo 6 programacion hibrida
gabo
 
Protocolos, estandares y tipos de modem
Protocolos, estandares y tipos de modemProtocolos, estandares y tipos de modem
Protocolos, estandares y tipos de modem
Mirna L. Torres Garcia
 
REDES NEURONALES De Hopfield
REDES NEURONALES De HopfieldREDES NEURONALES De Hopfield
REDES NEURONALES De Hopfield
ESCOM
 

Was ist angesagt? (20)

Ensayo ciclo De Instrucción
Ensayo ciclo De InstrucciónEnsayo ciclo De Instrucción
Ensayo ciclo De Instrucción
 
Gramáticas y Modelos Matemáticos - Clase 3
Gramáticas y Modelos Matemáticos - Clase 3Gramáticas y Modelos Matemáticos - Clase 3
Gramáticas y Modelos Matemáticos - Clase 3
 
Ubuntu. configurar tarjeta de red mediante lineas de comando
Ubuntu.   configurar tarjeta de red mediante lineas de comandoUbuntu.   configurar tarjeta de red mediante lineas de comando
Ubuntu. configurar tarjeta de red mediante lineas de comando
 
Lenguajes de simulación
Lenguajes de simulaciónLenguajes de simulación
Lenguajes de simulación
 
Estructuras (CAPAS) de un sistema operativo
Estructuras (CAPAS) de un sistema operativoEstructuras (CAPAS) de un sistema operativo
Estructuras (CAPAS) de un sistema operativo
 
redes neuronales Kohonen
redes neuronales Kohonenredes neuronales Kohonen
redes neuronales Kohonen
 
Teoría de Automatas
Teoría de AutomatasTeoría de Automatas
Teoría de Automatas
 
Procesos Ligeros: Hilos o Hebras
Procesos Ligeros: Hilos o HebrasProcesos Ligeros: Hilos o Hebras
Procesos Ligeros: Hilos o Hebras
 
Algoritmos y estructuras de datos en Python - digital.pdf
Algoritmos y estructuras de datos en Python - digital.pdfAlgoritmos y estructuras de datos en Python - digital.pdf
Algoritmos y estructuras de datos en Python - digital.pdf
 
Manual algoritmos y_estructura_de_datos
Manual algoritmos y_estructura_de_datosManual algoritmos y_estructura_de_datos
Manual algoritmos y_estructura_de_datos
 
Traductores de lenguaje
Traductores de lenguajeTraductores de lenguaje
Traductores de lenguaje
 
5.comprensión de los requerimientos
5.comprensión de los requerimientos5.comprensión de los requerimientos
5.comprensión de los requerimientos
 
U1 Analisis Algoritmos Complejidad
U1 Analisis Algoritmos ComplejidadU1 Analisis Algoritmos Complejidad
U1 Analisis Algoritmos Complejidad
 
Diseño de un contador sincrónico con flip-Flop JK, haciendo uso de mapas de k...
Diseño de un contador sincrónico con flip-Flop JK, haciendo uso de mapas de k...Diseño de un contador sincrónico con flip-Flop JK, haciendo uso de mapas de k...
Diseño de un contador sincrónico con flip-Flop JK, haciendo uso de mapas de k...
 
Las 4 P en el desarrollo de software
Las 4 P en el desarrollo de softwareLas 4 P en el desarrollo de software
Las 4 P en el desarrollo de software
 
Equipo 6 programacion hibrida
Equipo 6 programacion hibridaEquipo 6 programacion hibrida
Equipo 6 programacion hibrida
 
Protocolos, estandares y tipos de modem
Protocolos, estandares y tipos de modemProtocolos, estandares y tipos de modem
Protocolos, estandares y tipos de modem
 
Modelo en-espiral
Modelo en-espiralModelo en-espiral
Modelo en-espiral
 
REDES NEURONALES De Hopfield
REDES NEURONALES De HopfieldREDES NEURONALES De Hopfield
REDES NEURONALES De Hopfield
 
Paralelismo a nivel de Instrucciones
Paralelismo a nivel de InstruccionesParalelismo a nivel de Instrucciones
Paralelismo a nivel de Instrucciones
 

Andere mochten auch

Peña nieto infiltra el ieem
Peña nieto infiltra el ieemPeña nieto infiltra el ieem
Peña nieto infiltra el ieem
Pedro Guadiana
 
Boletin riate n2_7
Boletin riate n2_7Boletin riate n2_7
Boletin riate n2_7
gmsrosario
 
Asturias rutas y sendas de asturias
Asturias   rutas y sendas de asturiasAsturias   rutas y sendas de asturias
Asturias rutas y sendas de asturias
Juan Ignacio B.
 
Jernej petrin (studio moderna) including online_channels_into_multichannel_st...
Jernej petrin (studio moderna) including online_channels_into_multichannel_st...Jernej petrin (studio moderna) including online_channels_into_multichannel_st...
Jernej petrin (studio moderna) including online_channels_into_multichannel_st...
Društvo za marketing Slovenije
 
General presentation Luxembourg BioHealth Cluster
General presentation Luxembourg BioHealth ClusterGeneral presentation Luxembourg BioHealth Cluster
General presentation Luxembourg BioHealth Cluster
LuxBioHealth
 

Andere mochten auch (20)

Minecraft in 500 lines with Pyglet - PyCon UK
Minecraft in 500 lines with Pyglet - PyCon UKMinecraft in 500 lines with Pyglet - PyCon UK
Minecraft in 500 lines with Pyglet - PyCon UK
 
Python científico (introducción a numpy y matplotlib))
Python científico (introducción a numpy y matplotlib))Python científico (introducción a numpy y matplotlib))
Python científico (introducción a numpy y matplotlib))
 
Asafa Powell Double X El Hombre Mas Veloz Del Mundo Double X
Asafa Powell Double X El Hombre Mas Veloz Del Mundo Double XAsafa Powell Double X El Hombre Mas Veloz Del Mundo Double X
Asafa Powell Double X El Hombre Mas Veloz Del Mundo Double X
 
Peña nieto infiltra el ieem
Peña nieto infiltra el ieemPeña nieto infiltra el ieem
Peña nieto infiltra el ieem
 
Boletin riate n2_7
Boletin riate n2_7Boletin riate n2_7
Boletin riate n2_7
 
Presentación1 lina mayde
Presentación1 lina maydePresentación1 lina mayde
Presentación1 lina mayde
 
PortlandVancouveroffice Brochure
PortlandVancouveroffice BrochurePortlandVancouveroffice Brochure
PortlandVancouveroffice Brochure
 
I link, I like - Connectivism: Lernen in der Cloud - das Modell der Zukunft?
I link, I like - Connectivism: Lernen in der Cloud - das Modell der Zukunft?I link, I like - Connectivism: Lernen in der Cloud - das Modell der Zukunft?
I link, I like - Connectivism: Lernen in der Cloud - das Modell der Zukunft?
 
Aging, Mental Retardation and Physical Fitness
Aging, Mental Retardation and Physical FitnessAging, Mental Retardation and Physical Fitness
Aging, Mental Retardation and Physical Fitness
 
LA CRÓNICA 699
LA CRÓNICA 699LA CRÓNICA 699
LA CRÓNICA 699
 
Sentencia Final Tribunal Permanente de los Pueblos (TPP) Mexico 2014
Sentencia Final Tribunal Permanente de los Pueblos (TPP) Mexico 2014Sentencia Final Tribunal Permanente de los Pueblos (TPP) Mexico 2014
Sentencia Final Tribunal Permanente de los Pueblos (TPP) Mexico 2014
 
OFERTAS HISVE ENERO
OFERTAS HISVE ENEROOFERTAS HISVE ENERO
OFERTAS HISVE ENERO
 
Franchise Times 2008 Top 200
Franchise Times 2008 Top 200Franchise Times 2008 Top 200
Franchise Times 2008 Top 200
 
Jornal OJE edição 14ABR15
Jornal OJE edição 14ABR15Jornal OJE edição 14ABR15
Jornal OJE edição 14ABR15
 
Asturias rutas y sendas de asturias
Asturias   rutas y sendas de asturiasAsturias   rutas y sendas de asturias
Asturias rutas y sendas de asturias
 
Mkpv álvaro
Mkpv álvaro Mkpv álvaro
Mkpv álvaro
 
Jernej petrin (studio moderna) including online_channels_into_multichannel_st...
Jernej petrin (studio moderna) including online_channels_into_multichannel_st...Jernej petrin (studio moderna) including online_channels_into_multichannel_st...
Jernej petrin (studio moderna) including online_channels_into_multichannel_st...
 
General presentation Luxembourg BioHealth Cluster
General presentation Luxembourg BioHealth ClusterGeneral presentation Luxembourg BioHealth Cluster
General presentation Luxembourg BioHealth Cluster
 
MANAGING_ECO_DRIVING_20160218a
MANAGING_ECO_DRIVING_20160218aMANAGING_ECO_DRIVING_20160218a
MANAGING_ECO_DRIVING_20160218a
 
DGLR Membership
DGLR MembershipDGLR Membership
DGLR Membership
 

Ähnlich wie Introducción a las librerías PyGame y PyOpenGL

Practicas para slider Rene Dominguez
Practicas para slider Rene Dominguez Practicas para slider Rene Dominguez
Practicas para slider Rene Dominguez
Mery_Angie_Ugalde
 
Manual de practicas de Open GL
Manual de practicas de Open GLManual de practicas de Open GL
Manual de practicas de Open GL
Alincita Simon
 
Proyecto de reneya terminado
Proyecto de reneya terminadoProyecto de reneya terminado
Proyecto de reneya terminado
Karen_Avilaa
 
Open gl tutorial diana hernandez 303
Open gl tutorial diana hernandez 303Open gl tutorial diana hernandez 303
Open gl tutorial diana hernandez 303
Pablo Solis
 
Renderización en java
Renderización en javaRenderización en java
Renderización en java
aleja0940
 
Manual de Practicas de Open GL con Dev C++
Manual de Practicas de Open GL con Dev C++Manual de Practicas de Open GL con Dev C++
Manual de Practicas de Open GL con Dev C++
Alincita Simon
 
Api java 2D
Api  java 2DApi  java 2D
Api java 2D
ESPOL
 

Ähnlich wie Introducción a las librerías PyGame y PyOpenGL (20)

Estela y naye
Estela y nayeEstela y naye
Estela y naye
 
Practicas para slider Rene Dominguez
Practicas para slider Rene Dominguez Practicas para slider Rene Dominguez
Practicas para slider Rene Dominguez
 
Intro opengl
Intro openglIntro opengl
Intro opengl
 
Practicas OpenglC++
Practicas OpenglC++Practicas OpenglC++
Practicas OpenglC++
 
Manual de practicas de Open GL
Manual de practicas de Open GLManual de practicas de Open GL
Manual de practicas de Open GL
 
Proyecto de reneya terminado
Proyecto de reneya terminadoProyecto de reneya terminado
Proyecto de reneya terminado
 
Proyecto de reneya terminado
Proyecto de reneya terminadoProyecto de reneya terminado
Proyecto de reneya terminado
 
Manual de actividades
Manual de actividadesManual de actividades
Manual de actividades
 
Mini introopengl
Mini introopenglMini introopengl
Mini introopengl
 
Open gl tutorial diana hernandez 303
Open gl tutorial diana hernandez 303Open gl tutorial diana hernandez 303
Open gl tutorial diana hernandez 303
 
Iniciación a OpenGL
Iniciación a OpenGLIniciación a OpenGL
Iniciación a OpenGL
 
Ogre Game Engine
Ogre Game EngineOgre Game Engine
Ogre Game Engine
 
Manual de practicas segundo parcial
Manual de practicas segundo parcialManual de practicas segundo parcial
Manual de practicas segundo parcial
 
Opengl
OpenglOpengl
Opengl
 
Programación Open GL ES en iPhone e iPod touch
Programación Open GL ES en iPhone e iPod touchProgramación Open GL ES en iPhone e iPod touch
Programación Open GL ES en iPhone e iPod touch
 
Renderización en java
Renderización en javaRenderización en java
Renderización en java
 
Introduccion al OpenGL
Introduccion al OpenGLIntroduccion al OpenGL
Introduccion al OpenGL
 
Manual de Practicas de Open GL con Dev C++
Manual de Practicas de Open GL con Dev C++Manual de Practicas de Open GL con Dev C++
Manual de Practicas de Open GL con Dev C++
 
Renee opengl karla
Renee opengl karlaRenee opengl karla
Renee opengl karla
 
Api java 2D
Api  java 2DApi  java 2D
Api java 2D
 

Mehr von kdeespana

Mehr von kdeespana (20)

Desarrollando software libre sin ser informático akademy es 2017
Desarrollando software libre sin ser informático akademy es 2017Desarrollando software libre sin ser informático akademy es 2017
Desarrollando software libre sin ser informático akademy es 2017
 
Slimbook - Welcome to Freedom - Akademy-es 2017
Slimbook - Welcome to Freedom - Akademy-es 2017Slimbook - Welcome to Freedom - Akademy-es 2017
Slimbook - Welcome to Freedom - Akademy-es 2017
 
valgrind y ASAN Dos formas de instrumentar código en busca de errores
valgrind y ASAN Dos formas de instrumentar código en busca de erroresvalgrind y ASAN Dos formas de instrumentar código en busca de errores
valgrind y ASAN Dos formas de instrumentar código en busca de errores
 
KDE España: Qué es y para que sirve
KDE España: Qué es y para que sirve KDE España: Qué es y para que sirve
KDE España: Qué es y para que sirve
 
Qtquick, interfaces con animaciones fluídas en Qt5
Qtquick, interfaces con animaciones fluídas en Qt5Qtquick, interfaces con animaciones fluídas en Qt5
Qtquick, interfaces con animaciones fluídas en Qt5
 
Descubre plasma 5, el escritorio de la Comunidad KDE
Descubre plasma 5, el escritorio de la Comunidad KDEDescubre plasma 5, el escritorio de la Comunidad KDE
Descubre plasma 5, el escritorio de la Comunidad KDE
 
Clazy, mejorando tu código en tiempo de compilación
Clazy, mejorando tu código en tiempo de compilaciónClazy, mejorando tu código en tiempo de compilación
Clazy, mejorando tu código en tiempo de compilación
 
La potencia del Terminal
La potencia del TerminalLa potencia del Terminal
La potencia del Terminal
 
Novedades de C++11
Novedades de C++11Novedades de C++11
Novedades de C++11
 
10 formas de colaborar akademy es 2016
10 formas de colaborar akademy es 201610 formas de colaborar akademy es 2016
10 formas de colaborar akademy es 2016
 
Kool Desktop Environment
Kool Desktop EnvironmentKool Desktop Environment
Kool Desktop Environment
 
openQA y Open Build System
openQA y Open Build SystemopenQA y Open Build System
openQA y Open Build System
 
Plasma Next
Plasma NextPlasma Next
Plasma Next
 
KDE Frameworks, cuando Qt se nos queda corto
KDE Frameworks, cuando Qt se nos queda corto KDE Frameworks, cuando Qt se nos queda corto
KDE Frameworks, cuando Qt se nos queda corto
 
Qt5 en distintas plataformas
Qt5 en distintas plataformasQt5 en distintas plataformas
Qt5 en distintas plataformas
 
Next gen Desktop Apps
Next gen Desktop AppsNext gen Desktop Apps
Next gen Desktop Apps
 
KDE España: Qué es y para qué sirve
KDE España: Qué es y para qué sirveKDE España: Qué es y para qué sirve
KDE España: Qué es y para qué sirve
 
KDE connect - Akademy-es 2014 por Albert Vaca
KDE connect - Akademy-es 2014 por Albert VacaKDE connect - Akademy-es 2014 por Albert Vaca
KDE connect - Akademy-es 2014 por Albert Vaca
 
Next gen-apps
Next gen-appsNext gen-apps
Next gen-apps
 
Kde experience - Akademy-es 2014
Kde experience - Akademy-es 2014Kde experience - Akademy-es 2014
Kde experience - Akademy-es 2014
 

Kürzlich hochgeladen

Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
AnnimoUno1
 

Kürzlich hochgeladen (11)

EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
 
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
 
How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptxEVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
EVOLUCION DE LA TECNOLOGIA Y SUS ASPECTOSpptx
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 
Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 

Introducción a las librerías PyGame y PyOpenGL

  • 1. Akademy-es 2011 Introducción a las librerías Pygame y PyOpenGL
  • 2. ¿Qué necesitamos?(1) La presentación: goo.gl/3psq1 El código: goo.gl/6AD1A
  • 3. ¿Qué necesitamos?(2) ● Tener Python instalado en nuestro sistema. Por lo general viene incluido en prácticamente todas las distros de Linux populares. ● Tener instaladas las librerías Pygame y PyOpenGL Ejemplo en Ubuntu: ● sudo apt-get install python-pygame python-opengl freeglut3-dev ● ● O usando las setuptools de Python: ● ● sudo easy_install pygame ● sudo easy_install pyopengl
  • 4. ¿Qué son Pygame y PyOpenGL? Ambas son librerías gráficas ● procesado de gráficos 2D ● Manejo de gráficos 3D ● Gestor de ventanas ● Procesamiento matemático ● Manejo de eventos 3D interno ● Sonido ● ...
  • 5. Nuestros Objetivos Conseguir crear un pequeño programa en python que use pygame y pyopengl
  • 6. Inclusiones #Importamos las nuevas librerias import pygame from pygame.locals import * from OpenGL.GL import * from OpenGL.GLU import * from OpenGL.GL.shaders import * #Definimos el ancho y largo de nuestra ventana WIDTH = 600 HEIGHT = 600
  • 7. Inicializando Pygame def init(): #inicializamos pygame pygame.init() #creamos una pantalla de WIDTHxHEIGHT pixeles que use doblebuffer, #que se pueda redimensionar y que acepte opengl flags = DOUBLEBUF|OPENGL screen = pygame.display.set_mode((WIDTH, HEIGHT), flags)
  • 9. El método main(2) #Metodo main def main(): running = True init() while running: for event in pygame.event.get(): if event.type == QUIT: running = False pygame.quit() #Llamamos al metodo main main()
  • 10. La función init_gl def init_gl(): #Cada vez que se dibuja la escena esta se borra enteramente #glClearColor y ClearDepth definen el color y la profundidad #del borrado glClearColor(0.0,0.0,0.0,1.0); glClearDepth(1.0);
  • 11. La función resize_glscene def resize_glscene(w,h): #Especifica el tamaño de la ventana para OPENGL #Aunque la ventana física tenga ciertas dimensiones #podemos hacer que las de OpenGL no coincidan con #estas. glViewport(0,0,w,h); #Se establece la matriz de proyeccion como la identidad glMatrixMode(GL_PROJECTION); glLoadIdentity(); gluPerspective(45.0, float(w)/float(h), 0.1, 100.0); #Se establece la matriz de modelado como la identidad glMatrixMode(GL_MODELVIEW); glLoadIdentity();
  • 12. Dibujando la escena La función draw_scene(1) vertices = (GLfloat * (4*4))( 1.0, 1.0, 0.0, 1.0, 1.0,-1.0, 0.0, 1.0, -1.0,-1.0, 0.0, 1.0, -1.0, 1.0, 0.0, 1.0) def draw_scene(): #Limpiamos la pantalla glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); #Colocamos la matriz identidad glLoadIdentity(); #Movemos en el eje Z (profundidad) 6 puntos hacia atras glTranslatef(0.0, 0.0, -6.0);
  • 13. Dibujando la escena: Definiendo tipos en Python(1) ● Definiremos una variable de un tipo determinado tal y como lo haríamos en C ● Al igual que hacemos en C podemos crear arrays de esos tipos ● ¿Por qué hacer esto? PyOpenGL sólo acepta parámetros dados de esta forma en algunas de sus funciones
  • 14. Dibujando la escena: Definiendo tipos en Python(2) Nota: En C sería algo como GLfloat vertices[4*4]
  • 15. Coordenadas Homogéneas Todo punto del espacio con coordenadas (x,y,z) se puede expresar en coordenadas homogéneas como (x,y,z,1) Estas tienen su utilidad ya que la mayoría de los cambios sobre los puntos como rotaciones, traslaciones,... se expresan como matrices 4x4 Click para más información
  • 16. El código siguiente puede no funcionar dependiendo de la tarjeta gráfica que se tenga o los drivers instalados
  • 17. Dibujando la escena: La función draw_scene(2) #Pasa a OpenGL los datos almacenados en vertices y le asignamos #el identificador 0 glVertexAttribPointer(0, 4, GL_FLOAT, 1, 0, vertices); #Activamos este atributo con identificador 0 glEnableVertexAttribArray(0); #Dibujamos, usando cuadrados, los vertices en el orden 0,1,2,3 glDrawElements(GL_QUADS, len(faceIndex), GL_UNSIGNED_SHORT, faceIndex); #Desactivamos este atributo glDisableVertexAttribArray(0); ... def main(): ... #Le decimos al programa que en el identificador 0 posicionaremos #los datos para la variable "position" del shader glBindAttribLocation(program, 0, "position"); ...
  • 18. Dibujando la escena: La función glVertexAttribPointer
  • 19. Dibujando la escena: La función glDrawElements
  • 20. ¿Qué son los shaders? ● A groso modo son programas que se ejecutan en la GPU ● Existen varios lenguajes de alto nivel para programar Shaders. Por ejemplo: ○ GLSL (OpenGL Shading Language, desarrollado por el grupo Khronos) ○ HLSL (High Level Shading Language, desrrollado por Microsoft) ○ Cg (C for Graphics, desarrollado por Nvidia) Nosotros centraremos en GLSL
  • 21. Estructura de un programa en GLSL Tendremos dos fuentes distintos: Tipos de datos definidos: float, vec3, vec4, mat4,... Tipos de entrada/salida de datos: attribute, uniform y varying
  • 22. El Vertex Shader ● Opera sobre cada vértice ● Control total sobre lo que pasa en los vértices ● Se usa para: ○ Transformaciones en los vértices (Rotaciones, traslaciones, ...) ○ Transformaciones en las normales ○ Iluminación ○ Coordenadas de las texturas ○ ...
  • 23. El Fragment Shader ● Opera sobre cada pixel (No los de la pantalla, sino de los de cada figura) ● Se usa para: ○ Controlar los efectos sobre la imagen ○ Iluminación y sombras ○ ...
  • 24. Attributes, Uniforms y varyings ● Attributes: Son datos de entrada y salida que varían para cada vértice en cada rendering. Por ejemplo: Las coordenadas de los vertices o las normales son específicas de cada vértice ● Uniforms: Son datos de entrada y salida que se mantienen iguales para todos los vértices en cada rendering. Por ejemplo: la posición de una luz, una cierta matriz de transformaciones que queramos aplicar a todos los vértices,... ● Varyings: Son usados para comunicar datos entre el Vertex Shader y el Fragment Shader. Son variables de únicamente lectura en el FS y de lectura y escritura en el VS. Además han de ser declarados tanto en el VS como en el FS
  • 25. Creación de un programa: Pasos a seguir
  • 26. Creación de un programa: función load_shaders (1) def load_Shaders(vsFileName, fsFileName): #creamos un identificador del programa program = glCreateProgram(); #leemos el contenido de los ficheros vsSource = open(vsFileName, 'r').read() fsSource = open(fsFileName, 'r').read() #creamos unos identificadores de los shaders y les #asociamos su codigo vsShader = glCreateShader(GL_VERTEX_SHADER); #Vertex Shader glShaderSource(vsShader, vsSource); fsShader = glCreateShader(GL_FRAGMENT_SHADER); #Fragment Shader glShaderSource(fsShader, fsSource);
  • 27. Creación de un programa: función load_shaders (2) #Compilamos los shaders glCompileShader(vsShader); glCompileShader(fsShader); #Adjuntamos los shaders al programa glAttachShader(program, vsShader); glAttachShader(program, fsShader); #Enlazamos el programa glLinkProgram(program); return program
  • 28. Escribiendo el Vertex Shader void main() { gl_Position = gl_ModelViewProjectionMatrix * gl_Vertex; } ● Siempre debemos escribir en el VS el valor de gl_Position Define la posición final del vértice ● gl_ModelViewProjectionMatrix aplica las matrices de proyección y modelado. La de proyección viene dada en resize_glscene, la de modelado ha cambiado a lo largo del programa ● gl_Vertex toma los valores dados en el canal 0 de glVertexAttribPointer
  • 29. Escribiendo el Fragment Shader void main() { gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0); } ● Siempre debemos escribir en el FS el valor de gl_FragColor. Define el color final del pixel o fragmento. ● Lo coloreamos con el valor (1.0,1.0,1.0,1.0) que es blanco en RGBA
  • 30. La importancia de las funciones glGet(Attrib/Uniform)Location Problema: Al cambiar el índice en glVertexAttribArray deja de dibujar el cuadrado. Solución: Dejar la elección del índice a OpenGL def main(): ... #Solicitamos la posición de la variable "position" position = glGetAttribLocation(program, "position"); #Se la asignamos con bind glBindAttribLocation(program, position, "position"); def draw_scene(position): ... glVertexAttribPointer(position, 4, GL_FLOAT, 1, 0, vertices); glEnableVertexAttribArray(position); glDisabelVertexAttribArray(position);
  • 31. Tareas pendientes ● Añadir en el VS la variable de atributo de position ● ¿Como localizar la posición de las variables Uniforms? ● Hacer algo más divertido que un cuadrado Ampliando conocimientos: goo.gl/2yXhc
  • 32. ¡GRACIAS POR VENIR! Nos vemos en Twitter! Aarón Negrín Santamaría