SlideShare ist ein Scribd-Unternehmen logo
1 von 3
ACTIVIDADES CON GLSURFACEVIEW
ACTIVIDAD 01
En esta actividad vamos a crear nuestro escenario y entorno de trabajo sobre el que
desarrollar futuras actividades con GLSurfaceview.
PARTE 1: CREAR LA ACTIVITY Y PREPARAR LAYOUT
1. Inicia una nueva Activity que extienda a AppCompatActivity
2. Crea en el Layout un LinearLayout (vertical) que anide en su interior dos LinearLayout
3. El primero (vertical) tendrá una etiqueta de texto centrada y bajo esta una línea negra (2sp)
4. El segundo (vertical) tendrá 4 elementos en este orden de arriba a bajo
 Un RelativeLayout (vacio) con id, ocupando el ancho, 300 dp de alto y 20 dp de margen
 Una línea negra de 1sp
 Un Texto a ancho completo, ajustado en alto y centrado
 Una línea negra de 1sp
5. Ejecuta y comprueba que se parece a la siguiente imagen
PARTE 2: CREANDO LA SUPERCIE DE TRABAJO
1. Crea una clase pública externa haz que extienda de GLSurfaceView
2. Ponle un nombre que haga referencia a que es un GLSurface
3. Creale el constructor con el contexto como parámetro
4. A comtinuación crearemos el interfaz de renderizado
5. Crea una clase que hga alusión al renderizado (debajo de la GLSurfaceView)
6. Impleméntale el interface de renderizado del Surface
 implements GLSurfaceView.Renderer
7. Te mostrará error porque faltan los métodos
8. Ahora crearemos y sobreescribiremos los tres métodos de renderizado
 onSurfaceCreated(GL10 gl, EGLConfig config) {}
 onSurfaceChanged(GL10 gl, int ancho, int alto) { }
 onDrawFrame(GL10 gl) { }
PARTE 3: ENLAZANDO DEL RENDER CON EL GLSURFACE
1. Trabajando en la clase GLSurfaceView (GLS)
2. Hereda una clase de la que has creado para el renderizado
 Renderizado miRender;
3. Dentro del constructor crea esta clase
 miRender = new Renderizado();
4. Setea en el render de la vista esta clase
 setRenderer(miRender);
PARTE 4: ESTABLECIENDO LLAMADA DESDE LA VISTA PRINCIPAL
5. Trabajando con la clase principal
6. Inicializaremos un GLSurfaceView (GLS) y un RelativeLayout
 private GLSurfaceView glvista;
 RelativeLayout rl;
7. En onCreate enlazaremos el Relativelayout con el que tenemos en el layout de la vista
8. Crearemos el GlSurfaceView inicializado
 glvista = new GLSurfaceView(this);
9. Añadiremos al Relativelayout la vista del GlSurfaceView
 rl.addView(glvista);
10. Ejecuta y comprueba que se parece a la imagen de más abajo
11. Como pureza de código cuando la activity entre en pausa debes poner la vista GLS en pausa
 glvista.onPause();
12. Cuando se encuentre en onResume dbes ponerla en onResume
 glvista.onResume();
PARTE 5: MEJORANDO LOS MÉTODOS DE LA VISTA GLSURFACE
1. Volvemos a trabajar con la vista GLS
2. Mejoraremos los métodos propios para tenerlos preparadso para futuras actividades
3. Prímero trabajaremos con onSurfaceCreated
4. Añadiremos el siguiente código (suponiendo que le has puesto gl al parámetro GL10)
 gl.glClearColor(0.0f, 0.0f, 0.0f, 1.0f);
 gl.glClearDepthf(1.0f);
 gl.glEnable(GL10.GL_DEPTH_TEST);
 gl.glDepthFunc(GL10.GL_LEQUAL);
 gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_NICEST);
 gl.glShadeModel(GL10.GL_SMOOTH);
 gl.glDisable(GL10.GL_DITHER);
5. A continuación trabajaremos con onSurfaceChanged
6. Protegeremos el colapso del alto y deiniremos el aspecto
 if (alto == 0) alto = 1;
 float aspecto = (float) ancho / alto;
7. Añadiremos los siguientes métodos públicos
 gl.glViewport(0, 0, ancho, alto);
 gl.glMatrixMode(GL10.GL_PROJECTION);
 gl.glLoadIdentity();
 GLU.gluPerspective(gl, 45, aspecto, 0.1f, 100.f);
 gl.glMatrixMode(GL10.GL_MODELVIEW);
 gl.glLoadIdentity();
8. Por último modificaremos onDrawFrame
 gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
9. Ejecuta y comprueba que aparentemente nada ha cambiado

Weitere ähnliche Inhalte

Andere mochten auch

Αναφορά Ν. Μηταράκη σχετικά με την έκδοση εγγυητικών επιστολών από το ΤΜΕΔΕ
Αναφορά Ν. Μηταράκη σχετικά με την έκδοση εγγυητικών επιστολών από το ΤΜΕΔΕΑναφορά Ν. Μηταράκη σχετικά με την έκδοση εγγυητικών επιστολών από το ΤΜΕΔΕ
Αναφορά Ν. Μηταράκη σχετικά με την έκδοση εγγυητικών επιστολών από το ΤΜΕΔΕ
Notis Mitarachi
 
CV - Emad Fathi CM
CV - Emad Fathi CMCV - Emad Fathi CM
CV - Emad Fathi CM
emad salim
 
Maandelijkse beursupdate
Maandelijkse beursupdateMaandelijkse beursupdate
Maandelijkse beursupdate
Karel Mercx
 
Investment Banker - Issues and Considerations January PLI - 1-10-17
Investment Banker - Issues and Considerations January PLI - 1-10-17Investment Banker - Issues and Considerations January PLI - 1-10-17
Investment Banker - Issues and Considerations January PLI - 1-10-17
Kevin Miller
 
Commercialization of Technology in Ukraine P
Commercialization of Technology in Ukraine PCommercialization of Technology in Ukraine P
Commercialization of Technology in Ukraine P
Lucas Facioli Milanez
 
Chinese Immigration to Canada_Market Report_vFinal
Chinese Immigration to Canada_Market Report_vFinalChinese Immigration to Canada_Market Report_vFinal
Chinese Immigration to Canada_Market Report_vFinal
Lucas Facioli Milanez
 

Andere mochten auch (15)

8 Rules From the World’s Most Successful Female Leaders
8 Rules From the World’s Most Successful Female Leaders8 Rules From the World’s Most Successful Female Leaders
8 Rules From the World’s Most Successful Female Leaders
 
Αναφορά Ν. Μηταράκη σχετικά με την έκδοση εγγυητικών επιστολών από το ΤΜΕΔΕ
Αναφορά Ν. Μηταράκη σχετικά με την έκδοση εγγυητικών επιστολών από το ΤΜΕΔΕΑναφορά Ν. Μηταράκη σχετικά με την έκδοση εγγυητικών επιστολών από το ΤΜΕΔΕ
Αναφορά Ν. Μηταράκη σχετικά με την έκδοση εγγυητικών επιστολών από το ΤΜΕΔΕ
 
Bending the Rules: Community over Code over Policy.
Bending the Rules: Community over Code over Policy.Bending the Rules: Community over Code over Policy.
Bending the Rules: Community over Code over Policy.
 
CV - Emad Fathi CM
CV - Emad Fathi CMCV - Emad Fathi CM
CV - Emad Fathi CM
 
PROPOSAL
PROPOSALPROPOSAL
PROPOSAL
 
Loriana
LorianaLoriana
Loriana
 
Mood Relationship Ladder by Dr. Dar
Mood Relationship Ladder by Dr. DarMood Relationship Ladder by Dr. Dar
Mood Relationship Ladder by Dr. Dar
 
Families o functions
Families o functionsFamilies o functions
Families o functions
 
Maandelijkse beursupdate
Maandelijkse beursupdateMaandelijkse beursupdate
Maandelijkse beursupdate
 
Beurs update november
Beurs update novemberBeurs update november
Beurs update november
 
Investment Banker - Issues and Considerations January PLI - 1-10-17
Investment Banker - Issues and Considerations January PLI - 1-10-17Investment Banker - Issues and Considerations January PLI - 1-10-17
Investment Banker - Issues and Considerations January PLI - 1-10-17
 
Padrões de execução (feito extra rotula) dipp (1)
Padrões de execução (feito extra rotula) dipp (1)Padrões de execução (feito extra rotula) dipp (1)
Padrões de execução (feito extra rotula) dipp (1)
 
comparaison entre curriculum de sciences libanais et québécois
comparaison entre curriculum de sciences libanais et québécoiscomparaison entre curriculum de sciences libanais et québécois
comparaison entre curriculum de sciences libanais et québécois
 
Commercialization of Technology in Ukraine P
Commercialization of Technology in Ukraine PCommercialization of Technology in Ukraine P
Commercialization of Technology in Ukraine P
 
Chinese Immigration to Canada_Market Report_vFinal
Chinese Immigration to Canada_Market Report_vFinalChinese Immigration to Canada_Market Report_vFinal
Chinese Immigration to Canada_Market Report_vFinal
 

Ähnlich wie ANDROID. ACTIVIDAD GLSURFACEVIEW 01

Como insertar una imagen en eclipse java
Como insertar una imagen en eclipse javaComo insertar una imagen en eclipse java
Como insertar una imagen en eclipse java
Josué Naquid
 
Introduccion a java3 d
Introduccion a java3 dIntroduccion a java3 d
Introduccion a java3 d
FONCODES
 
Taller Python Gtk Glade
Taller Python Gtk GladeTaller Python Gtk Glade
Taller Python Gtk Glade
campus party
 
Planificando las bases de una aplicación windows phone
Planificando las bases de una aplicación windows phonePlanificando las bases de una aplicación windows phone
Planificando las bases de una aplicación windows phone
Sorey García
 

Ähnlich wie ANDROID. ACTIVIDAD GLSURFACEVIEW 01 (20)

Tutorial java fx_8_espanol
Tutorial java fx_8_espanolTutorial java fx_8_espanol
Tutorial java fx_8_espanol
 
Creando controles para Xamarin.Forms
Creando controles para Xamarin.FormsCreando controles para Xamarin.Forms
Creando controles para Xamarin.Forms
 
Como insertar una imagen en eclipse java
Como insertar una imagen en eclipse javaComo insertar una imagen en eclipse java
Como insertar una imagen en eclipse java
 
Aplicaciones moviles clase10 layout
Aplicaciones moviles clase10 layoutAplicaciones moviles clase10 layout
Aplicaciones moviles clase10 layout
 
Curso de Desarrollo Web 2
Curso de Desarrollo Web 2Curso de Desarrollo Web 2
Curso de Desarrollo Web 2
 
Como insertar una imagen en eclipse
Como insertar una imagen en eclipseComo insertar una imagen en eclipse
Como insertar una imagen en eclipse
 
Introduccion a java3 d
Introduccion a java3 dIntroduccion a java3 d
Introduccion a java3 d
 
Boris calle
Boris calleBoris calle
Boris calle
 
Manual de netbeans_7(2)(2)(2)
Manual de netbeans_7(2)(2)(2)Manual de netbeans_7(2)(2)(2)
Manual de netbeans_7(2)(2)(2)
 
Java 3 d manual
Java 3 d manualJava 3 d manual
Java 3 d manual
 
REPORTES
REPORTESREPORTES
REPORTES
 
Android Superstar - Buenas Prácticas
Android Superstar - Buenas PrácticasAndroid Superstar - Buenas Prácticas
Android Superstar - Buenas Prácticas
 
Taller Python Gtk Glade
Taller Python Gtk GladeTaller Python Gtk Glade
Taller Python Gtk Glade
 
Introducción al desarrollo Web: Frontend con Angular 6
Introducción al desarrollo Web: Frontend con Angular 6Introducción al desarrollo Web: Frontend con Angular 6
Introducción al desarrollo Web: Frontend con Angular 6
 
Planificando las bases de una aplicación windows phone
Planificando las bases de una aplicación windows phonePlanificando las bases de una aplicación windows phone
Planificando las bases de una aplicación windows phone
 
Practicas android studio efrain (1)
Practicas android studio efrain (1)Practicas android studio efrain (1)
Practicas android studio efrain (1)
 
GUIA DE LABORATORIO PHONE GAP JQUERY MOBILE CARGADO DE_DATOS_DE_REGISTROS...
GUIA DE  LABORATORIO  PHONE GAP JQUERY  MOBILE  CARGADO DE_DATOS_DE_REGISTROS...GUIA DE  LABORATORIO  PHONE GAP JQUERY  MOBILE  CARGADO DE_DATOS_DE_REGISTROS...
GUIA DE LABORATORIO PHONE GAP JQUERY MOBILE CARGADO DE_DATOS_DE_REGISTROS...
 
Video
VideoVideo
Video
 
Introducción a las librerías PyGame y PyOpenGL
Introducción a las librerías PyGame y PyOpenGLIntroducción a las librerías PyGame y PyOpenGL
Introducción a las librerías PyGame y PyOpenGL
 
Manual aplicaciones mobiles
Manual aplicaciones mobilesManual aplicaciones mobiles
Manual aplicaciones mobiles
 

Mehr von Jacinto Cabrera Rodríguez

Mehr von Jacinto Cabrera Rodríguez (20)

REDES: DUCTUS Y CANALETAS II
REDES: DUCTUS Y CANALETAS IIREDES: DUCTUS Y CANALETAS II
REDES: DUCTUS Y CANALETAS II
 
OTRAS UNIDADES DE ALMACENAMIENTO
OTRAS UNIDADES DE ALMACENAMIENTOOTRAS UNIDADES DE ALMACENAMIENTO
OTRAS UNIDADES DE ALMACENAMIENTO
 
DISPOSITIVOS MÓVILES: DIÁLOGOS Y NOTIFICACIONES
DISPOSITIVOS MÓVILES: DIÁLOGOS Y NOTIFICACIONESDISPOSITIVOS MÓVILES: DIÁLOGOS Y NOTIFICACIONES
DISPOSITIVOS MÓVILES: DIÁLOGOS Y NOTIFICACIONES
 
LAS FUENTES EN LA HISTORIA DEL ARTE
LAS FUENTES EN LA HISTORIA DEL ARTELAS FUENTES EN LA HISTORIA DEL ARTE
LAS FUENTES EN LA HISTORIA DEL ARTE
 
TOULOUSE LAUTREC
TOULOUSE LAUTRECTOULOUSE LAUTREC
TOULOUSE LAUTREC
 
PRÁCTICA MANEJO DE MEMORIA
PRÁCTICA MANEJO DE MEMORIAPRÁCTICA MANEJO DE MEMORIA
PRÁCTICA MANEJO DE MEMORIA
 
DISPOSITIVOS MÓVILES: MATERIAL DESIGN II
DISPOSITIVOS MÓVILES: MATERIAL DESIGN IIDISPOSITIVOS MÓVILES: MATERIAL DESIGN II
DISPOSITIVOS MÓVILES: MATERIAL DESIGN II
 
ZÓCALOS DE TARJETAS
ZÓCALOS DE TARJETASZÓCALOS DE TARJETAS
ZÓCALOS DE TARJETAS
 
ZÓCALOS DE PROCESADOR
ZÓCALOS DE PROCESADORZÓCALOS DE PROCESADOR
ZÓCALOS DE PROCESADOR
 
TIPOS DE MÓDULOS DE MEMORIA
TIPOS DE MÓDULOS DE MEMORIATIPOS DE MÓDULOS DE MEMORIA
TIPOS DE MÓDULOS DE MEMORIA
 
CARCASAS DE ORDENADOR
CARCASAS DE ORDENADORCARCASAS DE ORDENADOR
CARCASAS DE ORDENADOR
 
TIPOS DE TORNILLOS
TIPOS DE TORNILLOSTIPOS DE TORNILLOS
TIPOS DE TORNILLOS
 
PRACTICAS DE REDES: PRÁCTICA 26
PRACTICAS DE REDES: PRÁCTICA 26PRACTICAS DE REDES: PRÁCTICA 26
PRACTICAS DE REDES: PRÁCTICA 26
 
PRACTICAS DE REDES: PRÁCTICA 25
PRACTICAS DE REDES: PRÁCTICA 25PRACTICAS DE REDES: PRÁCTICA 25
PRACTICAS DE REDES: PRÁCTICA 25
 
PRACTICAS DE REDES: PRÁCTICA 24
PRACTICAS DE REDES: PRÁCTICA 24PRACTICAS DE REDES: PRÁCTICA 24
PRACTICAS DE REDES: PRÁCTICA 24
 
PRACTICAS DE REDES: PRÁCTICA 23
PRACTICAS DE REDES: PRÁCTICA 23PRACTICAS DE REDES: PRÁCTICA 23
PRACTICAS DE REDES: PRÁCTICA 23
 
REDES: TOMAS DE DATOS
REDES: TOMAS DE DATOSREDES: TOMAS DE DATOS
REDES: TOMAS DE DATOS
 
PRACTICAS DE REDES: PRÁCTICA 22
PRACTICAS DE REDES: PRÁCTICA 22PRACTICAS DE REDES: PRÁCTICA 22
PRACTICAS DE REDES: PRÁCTICA 22
 
PRACTICAS DE REDES: PRÁCTICA 21
PRACTICAS DE REDES: PRÁCTICA 21PRACTICAS DE REDES: PRÁCTICA 21
PRACTICAS DE REDES: PRÁCTICA 21
 
PRACTICAS DE REDES: PRÁCTICA 20
PRACTICAS DE REDES: PRÁCTICA 20PRACTICAS DE REDES: PRÁCTICA 20
PRACTICAS DE REDES: PRÁCTICA 20
 

ANDROID. ACTIVIDAD GLSURFACEVIEW 01

  • 1. ACTIVIDADES CON GLSURFACEVIEW ACTIVIDAD 01 En esta actividad vamos a crear nuestro escenario y entorno de trabajo sobre el que desarrollar futuras actividades con GLSurfaceview. PARTE 1: CREAR LA ACTIVITY Y PREPARAR LAYOUT 1. Inicia una nueva Activity que extienda a AppCompatActivity 2. Crea en el Layout un LinearLayout (vertical) que anide en su interior dos LinearLayout 3. El primero (vertical) tendrá una etiqueta de texto centrada y bajo esta una línea negra (2sp) 4. El segundo (vertical) tendrá 4 elementos en este orden de arriba a bajo  Un RelativeLayout (vacio) con id, ocupando el ancho, 300 dp de alto y 20 dp de margen  Una línea negra de 1sp  Un Texto a ancho completo, ajustado en alto y centrado  Una línea negra de 1sp 5. Ejecuta y comprueba que se parece a la siguiente imagen PARTE 2: CREANDO LA SUPERCIE DE TRABAJO 1. Crea una clase pública externa haz que extienda de GLSurfaceView 2. Ponle un nombre que haga referencia a que es un GLSurface 3. Creale el constructor con el contexto como parámetro 4. A comtinuación crearemos el interfaz de renderizado 5. Crea una clase que hga alusión al renderizado (debajo de la GLSurfaceView) 6. Impleméntale el interface de renderizado del Surface  implements GLSurfaceView.Renderer 7. Te mostrará error porque faltan los métodos 8. Ahora crearemos y sobreescribiremos los tres métodos de renderizado  onSurfaceCreated(GL10 gl, EGLConfig config) {}  onSurfaceChanged(GL10 gl, int ancho, int alto) { }  onDrawFrame(GL10 gl) { }
  • 2. PARTE 3: ENLAZANDO DEL RENDER CON EL GLSURFACE 1. Trabajando en la clase GLSurfaceView (GLS) 2. Hereda una clase de la que has creado para el renderizado  Renderizado miRender; 3. Dentro del constructor crea esta clase  miRender = new Renderizado(); 4. Setea en el render de la vista esta clase  setRenderer(miRender); PARTE 4: ESTABLECIENDO LLAMADA DESDE LA VISTA PRINCIPAL 5. Trabajando con la clase principal 6. Inicializaremos un GLSurfaceView (GLS) y un RelativeLayout  private GLSurfaceView glvista;  RelativeLayout rl; 7. En onCreate enlazaremos el Relativelayout con el que tenemos en el layout de la vista 8. Crearemos el GlSurfaceView inicializado  glvista = new GLSurfaceView(this); 9. Añadiremos al Relativelayout la vista del GlSurfaceView  rl.addView(glvista); 10. Ejecuta y comprueba que se parece a la imagen de más abajo 11. Como pureza de código cuando la activity entre en pausa debes poner la vista GLS en pausa  glvista.onPause(); 12. Cuando se encuentre en onResume dbes ponerla en onResume  glvista.onResume(); PARTE 5: MEJORANDO LOS MÉTODOS DE LA VISTA GLSURFACE 1. Volvemos a trabajar con la vista GLS 2. Mejoraremos los métodos propios para tenerlos preparadso para futuras actividades 3. Prímero trabajaremos con onSurfaceCreated 4. Añadiremos el siguiente código (suponiendo que le has puesto gl al parámetro GL10)
  • 3.  gl.glClearColor(0.0f, 0.0f, 0.0f, 1.0f);  gl.glClearDepthf(1.0f);  gl.glEnable(GL10.GL_DEPTH_TEST);  gl.glDepthFunc(GL10.GL_LEQUAL);  gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_NICEST);  gl.glShadeModel(GL10.GL_SMOOTH);  gl.glDisable(GL10.GL_DITHER); 5. A continuación trabajaremos con onSurfaceChanged 6. Protegeremos el colapso del alto y deiniremos el aspecto  if (alto == 0) alto = 1;  float aspecto = (float) ancho / alto; 7. Añadiremos los siguientes métodos públicos  gl.glViewport(0, 0, ancho, alto);  gl.glMatrixMode(GL10.GL_PROJECTION);  gl.glLoadIdentity();  GLU.gluPerspective(gl, 45, aspecto, 0.1f, 100.f);  gl.glMatrixMode(GL10.GL_MODELVIEW);  gl.glLoadIdentity(); 8. Por último modificaremos onDrawFrame  gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT); 9. Ejecuta y comprueba que aparentemente nada ha cambiado