安装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分别用于图片和文本切换。
常用的函数:
下面开始介绍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); }
}