Fast and Rich animations for Android Apps using OpenGL ES
Kauserali Hafizji
June Software
About Me @ Tap N Tap Android UI Toolkit for Tablets @ CrowdSpottr Built the android version @ June Software 2d Games for iOS and Android
This is ! a gaming session
Agenda
Understand why OpenGL ES for Android Apps Anatomy of an OpenGL ES Implementation My experiences of using OpenGL ES QnA
Why OpenGL ES?
Sdk Animations
Animations can be done in 2 ways:
Tweened animation Frame by frame animation
When to use default animations ?
Only in cases of simple animation requirements. Default animations are not sufficient for complex animations.
Sample complex animations
Inbuilt Gallery3d App built in OpenGL ES.
Talking Tom app
Easy to build with OpenGL ES.
Case Study: Sample Animation
10
1. Using Simple Views
Animate the views on the UI Thread itself. Problems Slow Each movement causes an invalidate on the parent view.
11
2. Using the canvas
Use the canvas to draw elements. Pros Is optimized since invalidation is on a part of the view. Cons For heavy items to be rendered, FPS reduces drastically rendering a jerky motion.
12
3. OpenGL ES
Use OpenGL to render the elements. Pros All the rendering happens in one view and we dont have to worry about invalidations. Can render 2X-5X of regular FPS. Cons Programming intensive.
13
What is OpenGL ES?
Cross-platform API for full function 2D and 3D graphics on embedded systems. Works as an interface between software and graphics acceleration.
14
State machine architecture
15
OpenGL ES Basic Terminology
Co-ordinate Axis ViewPorts Vertexes Polygons Meshes and Textures FPS
16
Co-ordinate axis
17
Viewports
Chunk of space that can be seen. OpenGL ES provides two kinds of viewports:
1. Perspective projection 2. Orthographic projection
18
Vertexes
A point in 3d space
X co-ordinate Y co-ordinate Z co-ordinate
19
Polygons
The biggest polygon that OpenGL ES allows you to draw is a triangle. Anything else needs to be drawn with a series of triangles.
20
Textures and Meshes
An image in OpenGL is termed as a texture. Textures are mapped onto a mesh of vertices.
3d Mesh
Textured Mesh
21
Animations with textured Meshes
Map an image to a mesh. Move the mesh around in 3d space according to the animation required.
22
OpenGL ES animation
Press Me
23
FPS Frames Per Second
Is the number of times onDraw is called in a second. Typical code to measure FPS would look like this:
24
25
Sample OpenGL ES program
26
Getting started with OpenGL ES
1. Set up the View. GLSurfaceView Glue to connect OpenGL ES to the view system. Allows OpenGL ES to work with the activity life cycle. 2. Set up the Renderer
GLSurfaceView.Renderer
Provides 3 utility functions:
onSurfaceChanged
27
onSurfaceCreatedonDrawFrame
In code
28
Common OpenGL ES problems
Introducing the GLSurfaceView in a 2d app can be resource intensive. You may notice a flicker at the start. To overcome Screen Flicker
Make sure the GLSurfaceView fills the entire screen.
29
References
Jeff Lamarches blog
(http://iphonedevelopment.blogspot.com)
Man pages
(http://www.khronos.org/opengles/sdk/1.1/docs/man/)
The red book
(http://www.glprogramming.com/red/)
OpenGL SuperBible
(http://www.opengl.org/sdk/docs/books/SuperBible/)
30
Conclusion
31
Questions??
32
Thank You
[email protected] @Ali_hafizji
33