Understanding View Animation

When a view is displayed on a presentation surface in Android, it goes through a transformation matrix. In graphics applications, you use transformation matrices to transform a view in some way. The process involves taking the input set of pixel coordinates and color combinations and translating them into a new set of pixel coordinates and color combinations. At the end of a transformation, you will see an altered picture in terms of size, position, orientation, or color.

You can achieve all of these transformations mathematically by taking the input set of coordinates and multiplying them in some manner using a transformation matrix to arrive at a new set of coordinates. By changing the transformation matrix, you can impact how a view will look. A matrix that doesn't change the view when you multiply by it is called an identity matrix. You typically start with an identity matrix and apply a series of transformations involving size, position, and orientation. You then take the final matrix and use that matrix to draw the view.

Android exposes the transformation matrix for a view by allowing you to register an animation object with that view. The animation object will have a callback that lets it obtain the current matrix for a view and change it in some manner to arrive at a new view. We will go through this process in this section.

Let's start by planning an example for animating a view. You'll begin with an activity where you'll place a ListView with a few items, similar to the way you began the example in the "Layout Animation" section. You will then create a button at the top of the screen to start the ListView animation when clicked (see Figure 6-5). Both the button and the ListView appear, but nothing has been animated yet. You'll use the button to trigger the animation.

Item 1

Item 2

Item 3

Item 4

Item 5

Item 6

Figure 6-5. The view-animation activity

When you click the Start Animation button in this example, you want the view to start small in the middle of the screen and gradually become bigger until it consumes all the space that is allocated for it. We'll show you how to write the code to make this happen. Listing 6-14 shows the XML layout file that you can use for the activity.

Listing 6-14. XML Layout File for the View-Animation Activity

<?xml version="1.0" encoding="utf-8"?>

0 0

Post a comment