ViewFlipper

最新推荐文章于 2025-08-07 17:35:28 发布

Carserdadi

最新推荐文章于 2025-08-07 17:35:28 发布

阅读量3.8k

点赞数 1

Android 专栏收录该内容

56 篇文章

订阅专栏

安装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之间的屏幕的切换

<?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>

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);

}

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); 
               //设置滑出动画   
             mViewFlipper.setOutAnimation(getApplicationContext(), R.anim.push_left_out);  
                //设置需要保存缓存
             mViewFlipper.setPersistentDrawingCache(ViewGroup.PERSISTENT_ALL_CACHES);
                //设置切换间隔
             mViewFlipper.setFlipInterval(1000);  
             // 显示下一个View
                mViewFlipper.showNext();   
//                mViewFlipper.showPrevious();// 显示上一个View
                //循环显示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);
    }

}