Android利用ViewFlipper实现屏幕切换动画效果

介绍ViewFilpper类

ViewFlipper

extends ViewAnimator

 

java.lang.Object
↳	android.view.View
	↳	android.view.ViewGroup
		↳	android.widget.FrameLayout
			↳	android.widget.ViewAnimator
				↳	android.widget.ViewFlipper

Class Overview

Simple ViewAnimator that will animate between two or more views that have been added to it. Only one child is shown at a time. If requested, can automatically flip between each child at a regular interval.

意思是：简单的ViewAnimator之间,两个或两个以上的view加上动画效果。只有一个小孩会显示在一个时间。如果需要,每个孩子能自动翻转之间在固定的时间间隔。

 

该类继承了Framelayout类，ViewAnimator类的作用是为FrameLayout里面的View切换提供动画效果。

 

该类有如下几个和动画相关的函数：

 setInAnimation：设置View进入屏幕时候使用的动画，该函数有两个版本，一个接受单个参数，类型为android.view.animation.Animation；一个接受两个参数，类型为Context和int，分别为Context对象和定义Animation的resourceID。  

 setOutAnimation: 设置View退出屏幕时候使用的动画，参数setInAnimation函数一样。

showNext： 调用该函数来显示FrameLayout里面的下一个View。

showPrevious： 调用该函数来显示FrameLayout里面的上一个View。

例如：主类

import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.Window;
import android.view.WindowManager;
import android.widget.ViewFlipper;

public class EX03_27 extends Activity
{
  public static String TAG = "HIPPO_DEBUG";
  private ViewFlipper mViewFlipper01;
  private float oldTouchValue;
  //private ImageView mImageView01;
  
  /** Called when the activity is first created. */
  @Override
  public void onCreate(Bundle savedInstanceState)
  {
    super.onCreate(savedInstanceState);
    getWindow().setFlags
    (
      WindowManager.LayoutParams.FLAG_FULLSCREEN,
      WindowManager.LayoutParams.FLAG_FULLSCREEN
    );
    requestWindowFeature(Window.FEATURE_NO_TITLE);
    setContentView(R.layout.main);
    mViewFlipper01 = (ViewFlipper)findViewById(R.id.myViewFlipper1);
    
    
    /*扩展学习
    mImageView01 = (ImageView)findViewById(R.id.myImageView1);
    // 建立动画TranslateAnimation
    Animation anim = new TranslateAnimation( 10, 200, 10, 400 );
    // 动画开始到结束的执行时间 (2000 = 2 秒)
    anim.setDuration(2000);
    // 设定动画重复次数，-1表示不断重复
    anim.setRepeatCount(-1);
    // 设定ImageView动画效果
    mImageView01.setAnimation(anim);
    // 动画开始
    anim.startNow();
    */
  }
  
  @Override
  public boolean onTouchEvent(MotionEvent event)
  {
    // TODO Auto-generated method stub
    switch (event.getAction())
    {
      case MotionEvent.ACTION_DOWN:
        oldTouchValue = event.getX();
        break;
      case MotionEvent.ACTION_UP:
        float currentX = event.getX();
        if (oldTouchValue < currentX)
        {
          mViewFlipper01.setInAnimation(AnimationHelper.inFromLeftAnimation());
          mViewFlipper01.setOutAnimation(AnimationHelper.outToRightAnimation());
          mViewFlipper01.showNext();
        }
        if (oldTouchValue > currentX)
        {
          mViewFlipper01.setInAnimation(AnimationHelper.inFromRightAnimation());
          mViewFlipper01.setOutAnimation(AnimationHelper.outToLeftAnimation());
          mViewFlipper01.showPrevious();
        }
        break;
      case MotionEvent.ACTION_MOVE:
        // TODO: Some code to make the ViewFlipper
        // act like the home screen.
        break;
      
    }
    return super.onTouchEvent(event);
  }
}

AnimationHelper类

　　

package irdc.ex03_27;

import android.view.animation.AccelerateInterpolator;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;

public class AnimationHelper
{
  public static Animation inFromRightAnimation()
  {
    Animation inFromRight = new TranslateAnimation(
        Animation.RELATIVE_TO_PARENT, +1.0f, Animation.RELATIVE_TO_PARENT,
        0.0f, Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT,
        0.0f);
    inFromRight.setDuration(350);
    inFromRight.setInterpolator(new AccelerateInterpolator());
    return inFromRight;
  }
  
  public static Animation outToLeftAnimation()
  {
    Animation outtoLeft = new TranslateAnimation(Animation.RELATIVE_TO_PARENT,
        0.0f, Animation.RELATIVE_TO_PARENT, -1.0f,
        Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
    outtoLeft.setDuration(350);
    outtoLeft.setInterpolator(new AccelerateInterpolator());
    return outtoLeft;
  }
  
  // for the next movement
  public static Animation inFromLeftAnimation()
  {
    Animation inFromLeft = new TranslateAnimation(Animation.RELATIVE_TO_PARENT,
        -1.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
        Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
    inFromLeft.setDuration(350);
    inFromLeft.setInterpolator(new AccelerateInterpolator());
    return inFromLeft;
  }
  
  public static Animation outToRightAnimation()
  {
    Animation outtoRight = new TranslateAnimation(Animation.RELATIVE_TO_PARENT,
        0.0f, Animation.RELATIVE_TO_PARENT, +1.0f,
        Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
    outtoRight.setDuration(350);
    outtoRight.setInterpolator(new AccelerateInterpolator());
    return outtoRight;
  }
}

　　布局文件 XML代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:background="@drawable/white"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  >
  <TextView
    android:id="@+id/myTextView0"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"
    android:textColor="@drawable/black"
    android:gravity="center_vertical|center_horizontal"
    android:text="@string/hello"/>
  
  <ViewFlipper
    android:id="@+id/myViewFlipper1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">  
    <LinearLayout
      android:orientation="vertical"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:background="@drawable/white">
      <TextView
        android:id="@+id/myTextView1"
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"
        android:textColor="@drawable/blue"
        android:text="@string/str_view_flipper1"/>
      <ImageView
      android:id="@+id/myImageView1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:src="@drawable/visa_512"
      />
      
    </LinearLayout>
    
    <LinearLayout
      android:orientation="vertical"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:background="@drawable/white">
      <TextView
        android:id="@+id/myTextView2"
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"
        android:textColor="@drawable/blue"
        android:text="@string/str_view_flipper2"/>
       <ImageView
      android:id="@+id/myImageView1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:src="@drawable/mastercard_512"
      />
      
    </LinearLayout>
  </ViewFlipper>
</LinearLayout>