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

jopen 10年前

1、屏幕切换指的是在同一个Activity内屏幕见的切换,最长见的情况就是在一个FrameLayout内有多个页面,比如一个系统设置页面;一个个性化设置页面。
2、介绍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。

3、首选看一下定义四个动画的xml文件:
 
in_left_right.xml——从左到右进入屏幕

<?xml version="1.0" encoding="utf-8"?>   <set       xmlns:android="http://schemas.android.com/apk/res/android"       >              <translate            android:fromXDelta="-100%p"           android:toXDelta="0"           android:duration="2000"           />      </set> 


out_left_right.xml——从左到右出去屏幕

<?xml version="1.0" encoding="utf-8"?>   <set       xmlns:android="http://schemas.android.com/apk/res/android"       >              <translate            android:fromXDelta="0"           android:toXDelta="100%p"           android:duration="2000"           />      </set> 

in_right_left.xml——从右到左进入屏幕

<?xml version="1.0" encoding="utf-8"?>   <set       xmlns:android="http://schemas.android.com/apk/res/android"       >              <translate            android:fromXDelta="100%p"           android:toXDelta="0"           android:duration="2000"           />      </set> 


out_right_left.xml——从右到左出去屏幕

<?xml version="1.0" encoding="utf-8"?>   <set       xmlns:android="http://schemas.android.com/apk/res/android"       >              <translate            android:fromXDelta="0"           android:toXDelta="-100%p"           android:duration="2000"           />      </set> 


4、定义main.xml文件

<?xml version="1.0" encoding="utf-8"?>   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"       android:layout_width="fill_parent"       android:layout_height="fill_parent"       android:background="#ffffff"       android:orientation="vertical"       android:padding="15dp" >          <ViewFlipper           android:id="@+id/flipper"           android:layout_width="fill_parent"           android:layout_height="fill_parent" >               <!-- 第一个页面 -->             <LinearLayout                        android:id="@+id/layout1"               android:layout_width="fill_parent"               android:layout_height="fill_parent"                android:orientation="vertical">                  <Spinner                   android:id="@+id/spinner"                   android:layout_width="fill_parent"                   android:layout_height="wrap_content" />                  <com.tiantang.testandroid1.MyTextView                   android:id="@+id/mytext"                   android:layout_width="fill_parent"                   android:layout_height="wrap_content"                   android:clickable="true"                   android:ellipsize="marquee"                   android:focusable="true"                   android:focusableInTouchMode="true"                   android:lines="1"                   android:marqueeRepeatLimit="marquee_forever"                   android:scrollHorizontally="true"                   android:text="1234567890987654321234556778909876765453234567898765322"                   android:textColor="#000000"                   android:textSize="20dp" />           </LinearLayout>           <!-- 第二个页面 -->             <SlidingDrawer               android:id="@+id/drawer"               android:layout_width="fill_parent"               android:layout_height="fill_parent"               android:content="@+id/content"               android:handle="@+id/handle" >                  <ImageView                   android:id="@id/handle"                   android:layout_width="50dp"                   android:layout_height="50dp"                   android:src="@drawable/info" />                  <ImageView                   android:id="@id/content"                   android:layout_width="fill_parent"                   android:layout_height="fill_parent"                   android:src="@drawable/confirm_bg" />           </SlidingDrawer>       </ViewFlipper>      </LinearLayout> 

 

5、java代码实现:

package com.tiantang.testandroid1;      import android.app.Activity;   import android.content.Context;   import android.os.Bundle;   import android.view.GestureDetector;   import android.view.GestureDetector.OnGestureListener;   import android.view.LayoutInflater;   import android.view.MotionEvent;   import android.view.View;   import android.view.View.OnTouchListener;   import android.view.ViewGroup;   import android.widget.ArrayAdapter;   import android.widget.BaseAdapter;   import android.widget.Button;   import android.widget.EditText;   import android.widget.ListView;   import android.widget.RadioButton;   import android.widget.SlidingDrawer;   import android.widget.Spinner;   import android.widget.TextView;   import android.widget.ViewFlipper;      public class TestAndroid1Activity extends Activity {       /** Called when the activity is first created. */       private Spinner spinner;              private ViewFlipper flipper;       private MyAdapter adapter;       private TextView text;       private SlidingDrawer drawer;       private GestureDetector detector;          @Override       public void onCreate(Bundle savedInstanceState) {           super.onCreate(savedInstanceState);           setContentView(R.layout.main);           spinner = (Spinner) findViewById(R.id.spinner);           drawer = (SlidingDrawer) findViewById(R.id.drawer);           flipper = (ViewFlipper) findViewById(R.id.flipper);           String[] strs = new String[]{"1234567890987654321234556778909876765453234567898765322"};           ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, R.layout.mytext, strs);           spinner.setAdapter(adapter);                      flipper.setLongClickable(true);           flipper.setOnTouchListener(new OnTouchListener() {               @Override               public boolean onTouch(View v, MotionEvent event) {                   // TODO Auto-generated method stub                   detector.onTouchEvent(event);                   return false;               }           });            detector = new GestureDetector(this, new OnGestureListener(){                   @Override                   public boolean onDown(MotionEvent e) {                       //用户轻触屏幕。(单击)                        return true;                   }                      @Override                   public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {                       //用户按下屏幕,快速移动后松开(就是在屏幕上滑动)                        //e1:第一个ACTION_DOWN事件(手指按下的那一点)                        //e2:最后一个ACTION_MOVE事件 (手指松开的那一点)                        //velocityX:手指在x轴移动的速度 单位:像素/秒                        //velocityY:手指在y轴移动的速度 单位:像素/秒                           int x = (int) (e2.getX() - e1.getX());                       if(x>0){                           flipper.setInAnimation(TestAndroid1Activity.this,R.anim.in_left_right );                                 flipper.setOutAnimation(TestAndroid1Activity.this,R.anim.out_left_right );                                 flipper.showPrevious();                                            }else{                           flipper.setInAnimation(TestAndroid1Activity.this,R.anim.in_right_left );                                 flipper.setOutAnimation(TestAndroid1Activity.this,R.anim.out_right_left );                                 flipper.showNext();                                        }                       return true;                   }                   @Override                   public void onLongPress(MotionEvent e) {                       // TODO Auto-generated method stub                       //用户长按屏幕                       }                   @Override                   public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {                       // TODO Auto-generated method stub                       return false;//用户按下屏幕并拖动                       }                   @Override                   public void onShowPress(MotionEvent e) {                       // TODO Auto-generated method stub                       //用户轻触屏幕,尚末松开或拖动,注意,强调的是没有没有松开或者拖动状态                   }                   @Override                   public boolean onSingleTapUp(MotionEvent e) {                       // TODO Auto-generated method stub                       return false;//用户轻触屏幕后松开。                   }               });       }