1
Fast and Rich animations for Android Apps using OpenGL ES
Kauserali HafizjiJune Software
2
About Me• @ Tap N Tap
• Android UI Toolkit for Tablets
• @ CrowdSpottr • Built the android version
• @ June Software• 2d Games for iOS and
Android
3
This is ! a gaming session
4
Agenda• Understand why OpenGL ES for
Android Apps• Anatomy of an OpenGL ES
Implementation• My experiences of using OpenGL ES• QnA
5
Why OpenGL ES?
6
Sdk Animations
• Animations can be done in 2 ways:• Tweened animation• Frame by frame animation
7
When to use default animations ?
• Only in cases of simple animation requirements.
• Default animations are not sufficient for complex animations.
8
Sample complex animations
Inbuilt Gallery3d App built in OpenGL ES.
9
Talking Tom app • Easy to build with
OpenGL ES.
10
Case Study: Sample Animation
11
1. Using Simple Views
Animate the views on the UI Thread itself.
Problems• Slow
• Each movement causes an invalidate on the parent view.
12
2. Using the canvasUse 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.
13
3. OpenGL ESUse OpenGL to render the elements.Pros
• All the rendering happens in one view and we don’t have to worry about invalidations.
• Can render 2X-5X of regular FPS.
Cons• Programming intensive.
14
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.
15
State machine architecture
16
OpenGL ES Basic Terminology• Co-ordinate Axis• ViewPorts• Vertexes• Polygons• Meshes and Textures• FPS
17
Co-ordinate axis
18
Viewports• Chunk of space that can be seen. • OpenGL ES provides two kinds of
viewports:
1. Perspective projection 2. Orthographic projection
19
Vertexes
• A point in 3d space• X co-ordinate• Y co-ordinate• Z co-ordinate
20
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.
21
Textures and Meshes• An image in OpenGL is termed as a
texture.• Textures are mapped onto a mesh of
vertices.
3d Mesh Textured Mesh
22
Animations with textured Meshes• Map an image to a mesh.• Move the mesh around in 3d space
according to the animation required.
23
OpenGL ES animation
Press Me
24
FPS – Frames Per Second• Is the number of times onDraw is called
in a second.• Typical code to measure FPS would
look like this:
25
26
Sample OpenGL ES program
27
Getting started with OpenGL ES1. 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:onSurfaceCreatedonDrawFrame onSurfaceChanged
28
In code
29
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.
30
References• Jeff Lamarche’s 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/)
31
Conclusion
32
Questions??
Top Related