Lesson 20. Animation
Android Lessons

Lesson 20. Animation


In this lesson we:

– Consider the animation of View components

Before serious topics, I decided to consider another interesting and, in my opinion, a simple topic. The truth is, I will only consider the top and not climb in the wild. The theme is animation. We will learn how to perform the following transformations with ordinary View components:
– change transparency
– resize
– to move
– to return

let’s create project:

Project name: P0201_SimpleAnimation
Build Target: Android 2.3.3
Application name: SimpleAnimation
Package name: ru.startandroid.develop.p0201simpleanimation
Create Activity: MainActivity

Transformations are configured in XML files, then programs are read and assigned to View elements in the code. I will not duplicate the help and paint everything, and immediately go to practice.

Our project has a folder really. You need to create a folder in it anim. You can do this, for example, by right-clicking on really and select from the menu New -> Folder. In the folder anim files need to be created. This is done in the same way: right click on anim and select from the menu New -> File. We will configure the animation in these files.

We create the following files in the res / anim folder:

filename: myalpha.xml

contents:



description of the transformation: Transparency changes from 0 to 1 within three seconds.

filename: myscale.xml

contents:



description of the transformation: Resizing from 0.1 from original width and height to 1. The point at which the scaling will take place lies exactly in the middle of the object (pivotX, pivotY). Duration – 3 sec.

filename: mytrans.xml

contents:



description of the transformation: Moves from -150 relative to the current position on the X axis and -200 along the Y axis to the current position (0,0). Duration – 3 sec.

filename: myrotate.xml

contents:



description of the transformation: 360 degree rotation at left upper corner (because pivotX, pivotY is not specified) for three seconds

filename: mycombo.xml

contents:



    
    
    
    

description of the transformation: Increase size and rotate simultaneously for three seconds. Note that the tag is used for the combination of transforms

So, we created 5 animation files.

And now we can apply them to View components.

open main.xml and create a screen:



    
    

The center of the screen is TextView, We will apply transformations to it. To do this, create a context menu for TextView, add menu items that match our sets, and when clicked, we will start the animation.

package ru.startandroid.develop.p0201simpleanimation;

import android.app.Activity;
import android.os.Bundle;
import android.view.ContextMenu;
import android.view.ContextMenu.ContextMenuInfo;
import android.view.MenuItem;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.TextView;

public class MainActivity extends Activity {

  // константы для ID пунктов меню
  final int MENU_ALPHA_ID = 1;
  final int MENU_SCALE_ID = 2;
  final int MENU_TRANSLATE_ID = 3;
  final int MENU_ROTATE_ID = 4;
  final int MENU_COMBO_ID = 5;

  TextView tv;

  /** Called when the activity is first created. */
  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    tv = (TextView) findViewById(R.id.tv);
    // регистрируем контекстное меню для компонента tv
    registerForContextMenu(tv);
  }

  @Override
  public void onCreateContextMenu(ContextMenu menu, View v,
      ContextMenuInfo menuInfo) {
    // TODO Auto-generated method stub
    switch (v.getId()) {
    case R.id.tv:
      // добавляем пункты
      menu.add(0, MENU_ALPHA_ID, 0, "alpha");
      menu.add(0, MENU_SCALE_ID, 0, "scale");
      menu.add(0, MENU_TRANSLATE_ID, 0, "translate");
      menu.add(0, MENU_ROTATE_ID, 0, "rotate");
      menu.add(0, MENU_COMBO_ID, 0, "combo");
      break;
    }
    super.onCreateContextMenu(menu, v, menuInfo);
  }

  @Override
  public boolean onContextItemSelected(MenuItem item) {
    Animation anim = null;
    // определяем какой пункт был нажат
    switch (item.getItemId()) {
    case MENU_ALPHA_ID:
      // создаем объект анимации из файла anim/myalpha
      anim = AnimationUtils.loadAnimation(this, R.anim.myalpha);
      break;
    case MENU_SCALE_ID:
      anim = AnimationUtils.loadAnimation(this, R.anim.myscale);
      break;
    case MENU_TRANSLATE_ID:
      anim = AnimationUtils.loadAnimation(this, R.anim.mytrans);
      break;
    case MENU_ROTATE_ID:
      anim = AnimationUtils.loadAnimation(this, R.anim.myrotate);
      break;
    case MENU_COMBO_ID:
      anim = AnimationUtils.loadAnimation(this, R.anim.mycombo);
      break;
    }
    // запускаем анимацию для компонента tv
    tv.startAnimation(anim);
    return super.onContextItemSelected(item);
  }
}

Animation is read from an xml file by the AnimationUtils.loadAnimation method, and an object of the Animation type is output. It is used in the startAnimation method that runs animation.

We will save everything and launch the application. We call the context menu for TextView, and test the animations

I didn’t use all the features and options. There is, for example, an option android: startOffset – it indicates the delay at start of animation. That is, if you specify android: startOffset = “1000”, the animation will start in a second. It’s handy to use if you’re doing a set of transforms () And you need them to run not in one go, but in a certain order. Also a useful parameter android: repeatCount is the number of repetitions.

I recommend playing parameters in XML files and see what happens.

In the next lesson:

– create a second screen in the application




Discuss in the forum [93 replies]

Leave a Reply

Your email address will not be published. Required fields are marked *