ViewFlipper

来源：互联网发布：qmask口罩知乎编辑：程序博客网时间：2024/06/06 09:05

安装APP后，首次进入时，经常看到几个页面的关于本应用的使用介绍，可通过点击上边的按钮和手势实现滑动，到最后页面时进入应用。这种效果的实现可以使用ViewFlipper。

ViewFlipper是间接继承自FrameLayout的。

android.widget.ViewAnimator类继承至FrameLayout，ViewAnimator类的作用是为FrameLayout里面的View切换提供动画效果。一般不直接使用ViewAnimator而是使用它的两个子类ViewFlipper和ViewSwitcher。

ViewFlipper可以用来指定FrameLayout内多个View之间的切换效果(可以指定切换动画，切换的间隔等)，可以一次性指定效果，也可以在每一个切换时指定切换效果。

ViewSwitcher顾名思义Switcher特指在两个View之间切换。可以通过该类指定一个ViewSwitcher.ViewFactory工程类来创建这两个View。该类也具有两个子类ImageSwitcher、TextSwitcher分别用于图片和文本切换。

常用的函数：

isFlipping：用来判断View切换是否正在进行。
setFilpInterval：设置View之间切换的时间间隔。
startFlipping：使用上面设置的时间间隔来开始切换所有的View，切换会循环进行。
stopFlipping: 停止View切换。
setOutAnimation:设置View退出屏幕时候使用的动画。
setInAnimation：设置View进入屏幕时候使用的动画。
showNext：调用该函数来显示FrameLayout里面的下一个View。
showPrevious：调用该函数来显示FrameLayout里面的上一个View。

下面开始介绍ViewFlipper具体的使用方法。

1.layout

在布局中使用了三个ViewGroup，每个ViewGroup中包含了一个ImageView和一个Button，其实就是这三个View之间的屏幕的切换

[java] view plaincopy
<span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>  
<ViewFlipper  xmlns:android="http://schemas.android.com/apk/res/android"  
       android:id="@+id/flipper"   
       android:layout_width="fill_parent"     
       android:layout_height="fill_parent" >  
       <FrameLayout  
           android:layout_width="fill_parent"  
           android:layout_height="fill_parent">  
            
           <ImageView    
              android:id="@+id/image1"     
              android:src="@drawable/pic1"   
              android:layout_width="fill_parent"   
              android:layout_height="fill_parent"  
            >    
           </ImageView>   
            <Button    
              android:text="Next"     
              android:id="@+id/Button_next1"   
              android:layout_width="wrap_content"     
              android:layout_height="wrap_content"  
              android:layout_gravity="bottom|right"  
              >    
           </Button>     
       </FrameLayout>  
       <FrameLayout  
           android:layout_width="fill_parent"  
           android:layout_height="fill_parent">  
           
           <ImageView    
              android:id="@+id/image2"     
              android:src="@drawable/pic2"   
              android:layout_width="fill_parent"   
              android:layout_height="wrap_content">    
           </ImageView>   
             
           <Button    
              android:text="Next"     
              android:id="@+id/Button_next2"   
              android:layout_width="wrap_content"     
              android:layout_height="wrap_content"  
               android:layout_gravity="bottom|right"  
              >    
           </Button>     
       </FrameLayout>  
       <FrameLayout  
           android:layout_width="fill_parent"  
           android:layout_height="fill_parent">  
           
           <ImageView    
              android:id="@+id/image3"     
              android:src="@drawable/pic3"   
              android:layout_width="fill_parent"   
              android:layout_height="wrap_content">    
           </ImageView>  
             
            <Button    
              android:text="Next"     
              android:id="@+id/Button_next3"   
              android:layout_width="wrap_content"     
              android:layout_height="wrap_content"  
              android:layout_gravity="bottom|right">    
           </Button>      
       </FrameLayout>  
</ViewFlipper></span>  

2.Activity中的代码

以下代码中一种是通过监听按钮的点击，点击后进行屏幕的切换
还有一种方法是通过GestureDetector来监听手势，通过手势的左右滑动就能进行屏幕的切换。
android.view.GestureDetector类可以检测各种手势事件，该类有两个回调接口分别用来通知具体的事件：
      GestureDetector.OnDoubleTapListener：用来通知DoubleTap事件，类似于鼠标的双击事件，该接口有如下三个回调函数：
    1. onDoubleTap(MotionEvent e)：通知DoubleTap手势，
    2. onDoubleTapEvent(MotionEvente)：通知DoubleTap手势中的事件，包含down、up和move事件（这里指的是在双击之间发生的事件，例如在同一个地方双击会产生DoubleTap手势，而在DoubleTap手势里面还会发生down和up事件，这两个事件由该函数通知）；
   3. onSingleTapConfirmed(MotionEvente)：用来判定该次点击是SingleTap而不是DoubleTap，如果连续点击两次就是DoubleTap手势，如果只点击一次，系统等待一段时间后没有收到第二次点击则判定该次点击为SingleTap而不是DoubleTap，然后触发SingleTapConfirmed事件。

GestureDetector.OnGestureListener：用来通知普通的手势事件，该接口有如下六个回调函数：
     1. onDown(MotionEvent e)：down事件；
   2. onSingleTapUp(MotionEvent e)：一次点击up事件；
   3. onShowPress(MotionEvente)：down事件发生而move或则up还没发生前触发该事件；
   4. onLongPress(MotionEvent e)：长按事件；
     5. onFling(MotionEvent e1, MotionEvent e2, float velocityX, floatvelocityY)：滑动手势事件；
   6. onScroll(MotionEvent e1, MotionEvent e2, float distanceX, floatdistanceY)：在屏幕上拖动事件。

在onCreate函数中初始化时
mGestureDetector= newGestureDetector(this); 参数是OnGestureListener，然后让ViewSliperTestActivity实现 OnGestureListener和OnDoubleTapListener接口即可。

我们在onFling回调中实现切换

@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY)

{

// TODO Auto-generated method stub

if(e1.getX()-e2.getX()>120)

{ //从右向左滑动时

mViewFlipper.showNext();
return true;

}

else if(e1.getX()-e2.getX()<120)

{

mViewFlipper.showPrevious();
return true;

}

return false;

}

注意重写下面的方法，否则onFling等接口不会有响应的。

@Override

public boolean onTouchEvent(MotionEvent event)

{
// TODO Auto-generated method stub

return mGestureDetector.onTouchEvent(event);

}

[java] view plaincopy
<span style="font-size:18px;">package com.liupan.viewslip;  
  
import android.app.Activity;  
import android.content.SharedPreferences;  
import android.os.Bundle;  
import android.util.Log;  
import android.view.GestureDetector;  
import android.view.GestureDetector.OnDoubleTapListener;  
import android.view.GestureDetector.OnGestureListener;  
import android.view.MotionEvent;  
import android.view.View;  
import android.view.animation.AnimationUtils;  
import android.widget.Button;  
import android.widget.Toast;  
import android.widget.ViewFlipper;  
  
public class ViewSliperTestActivity extends Activity implements  OnGestureListener,OnDoubleTapListener{  
    /** Called when the activity is first created. */  
    ViewFlipper mViewFlipper;  
    private GestureDetector mGestureDetector;  
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.main);  
      
        mGestureDetector = new GestureDetector(this);  
        Button buttonNext1 = (Button) findViewById(R.id.Button_next1);     
        mViewFlipper = (ViewFlipper) findViewById(R.id.flipper);     
        buttonNext1.setOnClickListener(new View.OnClickListener() {     
            public void onClick(View view) {     
             //可以在layout中定义相应的属性，也可以在代码中指定    
              //设置滑入动画   
             mViewFlipper.setInAnimation(getApplicationContext(), R.anim.push_left_in);   
<span></span></span><pre name="code" class="java"><span style="font-size:18px;">               //设置滑出动画     
             mViewFlipper.setOutAnimation(getApplicationContext(), R.anim.push_left_out);    
                //设置需要保存缓存  
             mViewFlipper.setPersistentDrawingCache(ViewGroup.PERSISTENT_ALL_CACHES);  
                //设置切换间隔  
             mViewFlipper.setFlipInterval(1000);    
             // 显示下一个View  
                mViewFlipper.showNext();     
//                mViewFlipper.showPrevious();// 显示上一个View<span></span><span></span>  
                //循环显示mViewFlipper内的所有View。     
//             mViewFlipper.startFlipping();     
        }     
        });     
      
        Button buttonNext2 = (Button) findViewById(R.id.Button_next2);     
        buttonNext2.setOnClickListener(new View.OnClickListener() {     
            public void onClick(View view) {     
                mViewFlipper.showNext();     
        }     
      
        });        
        Button buttonNext3 = (Button) findViewById(R.id.Button_next3);     
        buttonNext3.setOnClickListener(new View.OnClickListener() {     
            public void onClick(View view) {     
                mViewFlipper.showNext();     
        }     
      
        });     
    }  
    @Override  
    public boolean onDown(MotionEvent e) {  
        // TODO Auto-generated method stub  
        return false;  
    }  
    @Override  
    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,  
            float velocityY) {  
        // TODO Auto-generated method stub  
        if(e1.getX()-e2.getX()>120)  
        {  
        //从右向左滑动时  
            mViewFlipper.showNext();  
            return true;  
        }  
        else if(e1.getX()-e2.getX()<120)  
        {  
            mViewFlipper.showPrevious();  
            return true;  
        }  
        return false;  
    }  
    @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;  
    }  
    @Override  
    public boolean onDoubleTap(MotionEvent e) {  
        // TODO Auto-generated method stub  
        if(mViewFlipper.isFlipping())  
        {  
            mViewFlipper.stopFlipping();  
            return true;  
        }  
        else if(!mViewFlipper.isFlipping())  
        {  
            mViewFlipper.startFlipping();  
            return true;  
        }  
        return false;  
    }  
    @Override  
    public boolean onDoubleTapEvent(MotionEvent e) {  
        // TODO Auto-generated method stub  
        return false;  
    }  
    @Override  
    public boolean onSingleTapConfirmed(MotionEvent e) {  
        // TODO Auto-generated method stub  
        return false;  
    }  
    //重写本方法，否则GestureDetector检测不到触摸  
    @Override  
    public boolean onTouchEvent(MotionEvent event) {  
        // TODO Auto-generated method stub  
        return mGestureDetector.onTouchEvent(event);  
    }  
</span></pre><span style="font-size:18px">} <br>  
</span>  
<pre></pre>  

0 0