Droidcon talk - Nov 23,2013. Intel Bangalore. Code is present here http://github.com/arvind-devaraj/android-opengles. Slides are borrowed from many acknowledged

1. Introduction To
OpenGLES in Android

2. OpenGLES
●
Graphics Library for 3D

3. OpenGLES Terms
●
●
●
OpenGLES : Graphics API for doing 3D
operations on GPU / CPU
Primitives : lines, point, triangles
Texture : make the image
realistic by adding bitmap

4. CPU versus GPU
●
CPU
–
–
●
good at executing sequential code
Handles branches well
GPU
–
–
Same code, multiple data
Parallelism (ideal for image rendering)

5. Android Graphics
●
●
The View class handles display and
interaction with the user
GLSurfaceView class provides the glue to
connect OpenGLES to View system and
activity lifecycle

6. View
●
●
Manages the memory that can be composited
into the Android view system
Renders display in a separate thread,
decoupling from UI thread

7. Renderer
●
The renderer is responsible for making
OpenGL calls to render a frame.

8. Two Steps
GLSurfaceView
GLSurfaceView.Renderer

9. GLSurfaceView
GLSurfaceView view = new GLSurfaceView(this);
view.setEGLContextClientVersion(2);
view.setRenderer(new SquareRenderer());

10. GLSurfaceView.Renderer
●
The renderer is responsible for making
OpenGL calls to render a frame.
–
onDrawFrame() responsible for drawing the
current frame
–
OnSurfaceChanged() called when surface size
changes
–
OnSurfaceCreated() called when surface is
created

11. GLSurfaceView.Renderer
public class SquareRenderer implements GLSurfaceView.Renderer {
public void onSurfaceCreated(GL10 unused, EGLConfig config) {
GLES20.glClearColor(0.5f, 0.5f, 0.5f, 1.0f);
}
public void onDrawFrame(GL10 unused) {
GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT |
GLES20.GL_DEPTH_BUFFER_BIT);
}
public void onSurfaceChanged(GL10 unused, int width, int height) {
GLES20.glViewport(0, 0, width, height);
}
}

12. Make sure to add this!

13. Drawing a Basic
Shape

14. Define a Square
• All the 2D/ 3D objects needs to be defined using
Primitives.
• Vertex - A vertex is a point where two or more
edges meet
• Edges - A vertex (vertices in plural) is the smallest
building block of 3D model. A vertex is a point
where two or more edges meet
• Face is a triangle. Face is a surface between three
corner vertices and three surrounding edges.

15. -0.5f, -0.5f, 0.0f, // Bottom Left
0.5f, -0.5f, 0.0f, // Bottom Right
-0.5f, 0.5f, 0.0f, // Top Left
0.5f, 0.5f, 0.0f, // Top Right

16. private void initShapes(){
float squareCoords[] = {
//The coordinates
};
// initialize vertex Buffer for square
ByteBuffer vbb =
ByteBuffer.allocateDirect(squareCoords.length * 4);
vbb.order(ByteOrder.nativeOrder());
squareVB = vbb.asFloatBuffer();
squareVB.put(squareCoords);
squareVB.position(0);
}

17. Draw a square
Draw Methods
o
glDrawArrays()
o
glDrawElements()
Available Primitives in OpenGL ES
•
•
•
•
•
•
•
GL_POINTS
GL_LINE_STRIP
GL_LINE_LOOP
GL_LINES
GL_TRIANGLES
GL_TRIANGLE_STRIP
GL_TRIANGLE_FAN

18. GL_POINTS
GL_TRIANGLES
GL_LINES
GL_TRIANGLE_STRIP
GL_LINE_STRIP
GL_TRIANGLE_FAN

19. OpenGL Rendering Pipeline Simplified

20. Shader Programs
•
•
•
•
•
Vertex Shader
Fragment Shader
Loading the shader objects
Attaching the Shader objects to Shader program
Linking the program to create executable shader
program

22. Vertex Shader
attribute vec4 vertexPosition;
void main(){
gl_Position = vertexPosition;
}
Fragment Shader
precision mediump float;
void main(){
gl_FragColor = vec4(0.5, 0.5, 0.5, 1.0);
}

23. Loading the Shader
int vertexShader =
GLES20.glCreateShader(GLES20.GL_VERTEX_SHADER);
GLES20.glShaderSource(vertexShader, shaderCode);
GLES20.glCompileShader(vertexShader);
• GLES20.GL_FRAGMENT_SHADER

24. Compiling and Linking the Shader
program
shaderProgram = GLES20.glCreateProgram();
GLES20.glAttachShader(shaderProgram, vertexShader);
GLES20.glAttachShader(shaderProgram,
fragmentShader);
GLES20.glLinkProgram(shaderProgram);

26. attributePositionHandle =
GLES20.glGetAttribLocation(shaderProgram,"vertexPosition");

27. Drawing the square
GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT |
GLES20.GL_DEPTH_BUFFER_BIT);
GLES20.glUseProgram(shaderProgram);
GLES20.glVertexAttribPointer(attributePositionHandle,
3, GLES20.GL_FLOAT,
false, 12, squareVB);
GLES20.glEnableVertexAttribArray(attributePositionHandle);
GLES20.glDrawArrays(GLES20.GL_TRIANGLE_STRIP, 0, 4);