353Chapter 10
Android Animation: Making Your
UI Designs Move
In the previous chapter on graphic design, I covered two dimensional (2D) concepts, such as pixel
arrays and aspect ratios, as well as three dimensional (3D) concepts, such as layer stacks and
z-order. In this chapter, we are going to take all of that knowledge into the fourth dimension (4D),
which is time, and discover concepts such as motion and frame rate. We are again going to build
upon all of those fundamental graphic design concepts you learned about in the previous chapter,
because you can also apply all of those core digital imaging concepts to animation. Thus, we will
be taking “static” or motionless graphics from the previous chapter and turning them into motion
graphics which can look even more realistic, because it looks like the subject matter is moving
or animated.
You can use frame animation to create an illusion of motion using cels or frames, and you will be learning
about all of those concepts, terminology, and techniques you can use to do this in the next section of
the chapter. During this chapter, we’ll take a look at exactly how to set up frame-based animation inside
of your Android app, using an XML animation definition file containing a parent
your animation frames container. An
animation as child
use as a multimedia asset.
I will be covering more of the core Android classes which are used to implement graphic design
elements, such as ImageView, as well as Android classes which are used to implement frame
animation and procedural animation, AnimationDrawable (frame animation), and Animation
(procedural animation).
During the chapter, we will utilize these three Android graphics classes to “animate” the
SlidingPaneLayout UI layout container design. We’ll install an ImageView UI widget underneath your
Galaxy Info Screen to hold a spaceship animation, showing a different type of space vehicle for each
galaxy listed in the SlidingPaneLayout container.