Lecture 8: Graphics By: Eliav Menachi

Graphics Android custom 2D graphics library OpenGL ES 1.0 for high performance 3D graphics

2D graphics When drawing 2D graphics, you'll typically do so in one of two ways Draw your graphics or animations into a View object from your layout. Draw directly to a Canvas

Drawing into a view Best choice when drawing simple graphics Where is no need to change dynamically Its not part of a performance-intensive game The drawing and animation is handled by the system's normal View hierarchy drawing process You simply define the graphics to go inside the View

Simple Graphics Inside a View Android offers a custom 2D graphics library for drawing and animating shapes and images: android.graphics.drawable android.view.animation

Drawables A Drawable is a general abstraction for "something that can be drawn" There are three ways to define and instantiate a Drawable: using an image saved in your project resouces using an XML file that defines the Drawable properties using the normal class constructors

ShapeDrawable ShapeDrawable is used to dynamically draw some two-dimensional graphics A ShapeDrawable is an extension of Drawable ShapeDrawable has its own draw() method you can create a subclass of View that draws the ShapeDrawable during the View.onDraw() method See Simple Shape example

Drawing directly to a Canvas When you're application needs to regularly re-draw itself (like games) There's more than one way to do this: In the same thread as your UI Activity, using a custom View in your layout, call invalidate() and then handle the onDraw() callback.. In a separate thread, by managing a SurfaceView and performing draws to the Canvas as fast as your thread is capable.

Draw with a Canvas A Canvas works for you as a pretense, or interface, to the actual surface upon which your graphics will be drawn The Canvas holds all of your "draw" calls Via the Canvas, your drawing is actually performed upon an underlying Bitmap, which is placed into the window. Using the canvas: On a View On a SurfaceView

On a View Create a custom View component Override the onDraw() callback method This method will be called by the Android framework to request that the View draw itself Use the given Canvas for drawing The View is drawn by Android only when invalidated Use Invalidate() to invalidate the View See SimpleShape Example

Programmatic Animation Create an animated View Create a Drawable to hold our animated image Override the onDraw method which draw the view Setting bounds defines the position and size of the image inside the View Display the view in your activity and update the view periodically

On a SurfaceView The SurfaceView is a special subclass of View that offers a dedicated drawing surface within the View hierarchy The aim is to offer this drawing surface to an application's secondary thread The application isn't required to wait until the system's View hierarchy is ready to draw Secondary thread can draw to its own Canvas at its own pace using a reference to the SurfaceView

Using the Surface View 1 Create a new class that extends SurfaceView The class should also implement SurfaceHolder.Callback an interface that will notify you with information about the underlying Surface (created, changed, or destroyed) Define your secondary Thread class The thread will perform all the drawing procedures to your Canvas

Using the Surface View 2 When your SurfaceView is initialized, get the SurfaceHolder by calling getHolder() Instead of handling the Surface object directly, you should handle it via a SurfaceHolder Notify the SurfaceHolder that you'd like to receive SurfaceHolder callbacks by calling addCallback() Override each of the SurfaceHolder.Callback methods inside your SurfaceView class.

The Drawing Thread Pass the SurfaceHandler to the thread Retrieve the Canvas with lockCanvas() Do the drawing Call unlockCanvasAndPost(), passing it your Canvas object The Surface will now draw the Canvas as you left it

Tween Animation A tween animation can perform a series of simple transformations (position, size, rotation, and transparency) on the contents of a View object A sequence of animation instructions defines the tween animation The instructions are defined by either XML or Android code

Tween Animation The animation instructions defines: The transformations when the transformation will occur How long they should take to apply Transformations can be sequential or simultaneous

Frame Animation Created a sequence of different images, played in order, like a roll of film The XML file that lists the frames that compose the animation The XML file consists of an <animation-list> element as the root node and a series of child <item> nodes that each define a frame The frame is a drawable resource for the frame and the frame duration. See simple animation example

OpenGL ES (Embedded Systems) OpenGL defines a cross-platform and cross-language API for computer graphics OpenGL ES is a limited version of OpenGL costumed for mobile phones, PDAs, video game consoles, and other embedded systems OpenGL ES standard: http://www.khronos.org/opengles/ http://www.zeuscmd.com/tutorials/opengles/index.php

Use OpenGL ES Create a custom View subclass. Get a handle to an OpenGLContext, which provides access to Android’s OpenGL ES functionality. In the View’s onDraw() method, use the handle to the GL object and then use its methods to perform any GL functions.