Slides for Juan's talk

Graphics & Animation

in Android

Android

rendering

options

•
The Canvas API

•
Renderscript

•
OpenGL wrappers

•
NDK OpenGL




http://graphics
-
geek.blogspot.com
/2011/06/android
-
rendering
-
options.html


The Canvas API

•
Standard
rendering for a typical SDK
application that uses View objects (standard
and custom
)

•
c
onsists
of calls to each
View's
onDraw
()

method. This method takes a single
parameter, Canvas, which is the object used
by the view to draw its content.


http://graphics
-
geek.blogspot.com
/2011/06/android
-
rendering
-
options.html


Renderscript

•
Introduced
in Android
3.0

•
API targeted


high
-
performance
3D rendering and
compute
operations

•
a

3D
rendering API on top of hardware
acceleration,
language

C99

•
executing native code on the
device still cross
-
platform

•
u
se of extensions that are
placed into the
application package



http://graphics
-
geek.blogspot.com
/2011/06/android
-
rendering
-
options.html


Renderscript

•
Live Wallpapers, the video wall view in the
YouTube application, and the Books
application (including that beautiful page
-
turn
effect).


•
http://www.youtube.com/watch?v=uQ5NumRfHN4





http://graphics
-
geek.blogspot.com
/2011/06/android
-
rendering
-
options.html


Open GL
Wrappers

•
OpenGL APIs at the SDK
level

•
not
a recommended practice as a general
approach for complex scenes that require
high
-
performance
graphics

•
difficult to achieve high performance levels
equivalent to native access to OpenGL due to
the overhead of calling down from the
SDK

•
Music application that shipped with Android
3.0 used this approach

http://graphics
-
geek.blogspot.com
/2011/06/android
-
rendering
-
options.html


NDK OpenGL

•
no access
to the View objects, or the events,
or the rest of the infrastructure that is
provided in the SDK
APIs

•
graphics environment
sufficient
for some
specific
purposes: game developers

•
compiles applications to specific CPU
architectures

http://graphics
-
geek.blogspot.com
/2011/06/android
-
rendering
-
options.html


Animations

•
Animations prior to Android 3.0

–
android.view.animation

–
move, scale, rotate, and fade
Views

–
combine multiple animations together in
an

AnimationSet

–
specify animations in
a
LayoutAnimationController

to get automatically staggered animation


–
u
se
Interpolator

implementations
like
AccelerateInterpolator

and

Bounce

to get natural,
nonlinear timing behavior



http://android
-
developers.blogspot.com
/2011/02/animation
-
in
-
honeycomb.html

Animations

•
Animations prior to Android 3.0

–
you
can animate Views... and that's
it

–
How

to

animate

the

position of a
Drawable

in a
custom

drawing
?
Or

translucency
?

–
you can move, rotate, scale, and fade a View... and
that's it
.

–
animating the background color of a View?

–
hard
-
coded
set of things they were able to do, and
you could not make them do anything else.

http://android
-
developers.blogspot.com
/2011/02/animation
-
in
-
honeycomb.html

Animations

•
Animations in Android 3.0

–
not specific to
Views

–
animates
values over
time

–
assigning those values to
any target
objects and
properties


•
http://www.youtube.com/watch?feature=play
er_embedded&v=
-
9nxx066eHE#!

http://android
-
developers.blogspot.com
/2011/02/animation
-
in
-
honeycomb.html

Animations

•
Animator

–
superclass
for classes which provide basic support
for animations which can be started, ended, and
have

AnimatorListeners

added to them



java.lang.Object


↳

android.animation.Animator




↳

android.animation.AnimatorSet

java.lang.Object


↳

android.animation.Animator


↳

android.animation.ValueAnimator






↳

android.animation.ObjectAnimator

Animations

•
AnimatorSet

–

choreograph multiple animators together into a
single
animation

–

animations
can be set up to play together, in
sequence, or after a specified
delay

–
“
It is possible to set up a

AnimatorSet

with circular
dependencies between its
animations…
results of
this configuration are
undefined…
circular
dependencies should be
avoided”




http://android
-
developers.blogspot.com
/2011/02/animation
-
in
-
honeycomb.html

Animations

•
ValueAnimator

–

runs the internal timing loop that causes all of a
process's animations to calculate and set values

–

two
pieces to animating properties: calculating
the animated values and setting those values on
the object and property in
question.
ValueAnimator

takes care of the first part;
calculating the values





http://android
-
developers.blogspot.com
/2011/02/animation
-
in
-
honeycomb.html

Animations

•
ObjectAnimator

–
takes care of the second part : setting animating
values on the object and property

–
main class
in
the new animation system





ObjectAnimator.ofFloat
(
myObject
, "alpha", 0f).start();


public void
setAlpha
(float value);

public
float
getAlpha
();

http://android
-
developers.blogspot.com
/2011/02/animation
-
in
-
honeycomb.html

•
View
properties

–
added

new properties to the View class

in
Honeycomb

•
translationX

and

translationY

•
rotation
,

rotationX
, and

rotationY

•
scaleX

and

scaleY

•
pivotX

and

pivotY

•
x

and

y

•
alpha

Animations

http://android
-
developers.blogspot.com
/2011/02/animation
-
in
-
honeycomb.html

•
AnimatorSet

–
choreograph multiple animations




ObjectAnimator

fadeOut

=
ObjectAnimator.ofFloat
(v1, "alpha", 0f
);






ObjectAnimator

mover =
ObjectAnimator.ofFloat
(v2, "
translationX
",
-
500f, 0f
);






ObjectAnimator

fadeIn

=
ObjectAnimator.ofFloat
(v2, "alpha", 0f, 1f
);






AnimatorSet

animSet

= new
AnimatorSet
().play(mover).with(
fadeIn
).after(
fadeOut
);

Animations

http://android
-
developers.blogspot.com
/2011/02/animation
-
in
-
honeycomb.html

•
TypeEvaluator

–
The system
knows how to
animate

float

and

int

values, but otherwise it needs
some help knowing how to interpolate between the
values you give it



–
a
dd this interface to the ValueEvaluator


Interface
TypeEvaluator

{


public
abstract T

evaluate

(float fraction, T
startValue
, T
endValue
)



}

Animations

http://android
-
developers.blogspot.com
/2011/02/animation
-
in
-
honeycomb.html