用ViewFlipper可以实现图片切换。
屏幕切换指的是在同一个Activity内屏幕见的切换,最长见的情况就是在一个FrameLayout内有多个页面,比如一个系统设置页面;一个个性化设置页面。
android.widget.ViewAnimator类继承至FrameLayout,ViewAnimator类的作用是为FrameLayout里面的View切换提供动画效果。该类有如下几个和动画相关的函数:
setInAnimation:设置View进入屏幕时候使用的动画,该函数有两个版本,一个接受单个参数,类型 为 android.view.animation.Animation,一个接受两个参数,类型为Context和int,分别为Context对象和定义Animation的resourceID。
setOutAnimation: 设置View退出屏幕时候使用的动画,参数setInAnimation函数一样。
showNext: 调用该函数来显示FrameLayout里面的下一个View。
showPrevious: 调用该函数来显示FrameLayout里面的上一个View。
一般不直接使用ViewAnimator,而是使用它的两个子类ViewFlipper和ViewSwitcher。ViewFlipper可以用来指定FrameLayout内多个View之间的切换效果,可以一次指定也可以每次切换的时候都指定单独的效果。该类额外提供了如下几个函数:
isFlipping:用来判断View切换是否正在进行
setFilpInterval:设置View之间切换的时间间隔
startFlipping:使用上面设置的时间间隔来开始切换所有的View,切换会循环进行
stopFlipping: 停止View切换
ViewSwitcher
Switcher特指在两个View之间切换。可以通过该类指定一个ViewSwitcher.ViewFactory 工程类来创建这两个View。该类也具有两个子类ImageSwitcher、TextSwitcher分别用于图片和文本切换。
ViewFlipper
ViewFlipper是继承至FrameLayout的,所以它是一个Layout里面可以放置多个View。在示例中定义一个ViewFlipper,里面包含三个ViewGroup作为示例的三个屏幕,每个ViewGroup中包含一个按钮和一张图片,点击按钮则显示下一个屏幕。
例子如下:
res\layout\main.xml
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout
- xmlns:android="http://schemas.android.com/apk/res/android"
- android:orientation="vertical"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent">
- <ViewFlipper android:id="@+id/flipper"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:persistentDrawingCache="animation"
- android:flipInterval="1000"
- android:inAnimation="@anim/push_left_in"
- android:outAnimation="@anim/push_left_out">
- <LinearLayout
- android:orientation="vertical"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent">
- <Button
- android:text="Next"
- android:id="@+id/Button_next1"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content">
- </Button>
- <ImageView
- android:id="@+id/image1"
- android:src="@drawable/image1"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content">
- </ImageView>
- </LinearLayout>
- <LinearLayout
- android:orientation="vertical"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent">
- <Button
- android:text="Next"
- android:id="@+id/Button_next2"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content">
- </Button>
- <ImageView
- android:id="@+id/image2"
- android:src="@drawable/image2"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content">
- </ImageView>
- </LinearLayout>
- <LinearLayout
- android:orientation="vertical"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent">
- <Button
- android:text="Next"
- android:id="@+id/Button_next3"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content">
- </Button>
- <ImageView
- android:id="@+id/image3"
- android:src="@drawable/image3"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content">
- </ImageView>
- </LinearLayout>
- </ViewFlipper>
- </LinearLayout>
在Layout定义中指定动画的相关属性就可以了,通过persistentDrawingCache指定缓存策略;flipInterval指定每个View动画之间的时间间隔;inAnimation和outAnimation分别指定View进出使用的动画效果。动画效果定义如下:
res\anim\push_left_in.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="500"/>
- <alpha
- android:fromAlpha="0.0"
- android:toAlpha="1.0"
- android:duration="500" />
- </set>
res\anim\push_left_out.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="500"/>
- <alpha
- android:fromAlpha="1.0"
- android:toAlpha="0.0"
- android:duration="500" />
- </set>
Activity
- import android.app.Activity;
- import android.os.Bundle;
- 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.View.OnTouchListener;
- import android.widget.Button;
- import android.widget.ViewFlipper;
- public class MyViewFlipperActivity extends Activity implements OnGestureListener , OnDoubleTapListener{
- private ViewFlipper mViewFlipper;
- private GestureDetector mGestureDetector;
- 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);
- mViewFlipper.showNext();
- //调用下面的函数将会循环显示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();
- }
- });
- }
- public boolean onDoubleTap(MotionEvent e) { //双击的时候触发,
- 如果在上面使用了mViewFlipper.startFlipping(); 图片将不停在切换,但是如果我们双击屏幕,将停止不停切换,变为正常的情况下,用手势或者按钮切换,当我们再次双击的时候,又不停地切换了。
- if(mViewFlipper.isFlipping()) {
- mViewFlipper.stopFlipping();
- }else {
- mViewFlipper.startFlipping();
- }
- return true;
- }
- public boolean onDoubleTapEvent(MotionEvent e) {
- return false;
- }
- public boolean onSingleTapConfirmed(MotionEvent e) {
- return false;
- }
- public boolean onDown(MotionEvent e) {
- return false;
- }
- public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
- float velocityY)
- {
- // e1:第1个ACTION_DOWN MotionEvent
- // e2:最后一个ACTION_MOVE MotionEvent
- // velocityX:X轴上的移动速度,像素/秒
- // velocityY:Y轴上的移动速度,像素/秒
- if(e1.getX() > e2.getX()+10) { //向左划超过10px
- mViewFlipper.showNext();
- }
- else if(e1.getX() < e2.getX()+10) { //向右划超过10px
- mViewFlipper.setInAnimation(getApplicationContext(), R.anim.push_left_in);
- mViewFlipper.setOutAnimation(getApplicationContext(), R.anim.push_left_out);
- mViewFlipper.showPrevious();
- mViewFlipper.setInAnimation(getApplicationContext(), R.anim.push_left_in);
- mViewFlipper.setOutAnimation(getApplicationContext(), R.anim.push_left_out);
- }
- else {
- return false;
- }
- return true;
- }
- public void onLongPress(MotionEvent e) {
- }
- public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
- float distanceY) {
- return false;
- }
- public void onShowPress(MotionEvent e) {
- }
- public boolean onSingleTapUp(MotionEvent e) {
- return false;
- }
- public boolean onTouchEvent(MotionEvent event) { ///加载监听,这个函数是Activity内有的函数。mGestureDetector.onTouchEvent(event);
- }
- /*我们也可以使用接口OnTouchListener的方法public boolean onTouch(View v, MotionEvent event)
- *主要我们在类中implements OnTouchListener了这个接口就行了
- * 这两种方法很类似,都说不出有什么区别,
- *如果我们的类没有继承Activity,但是想添加监听,我就建议先implements OnTouchListener
- *实现它的方法onTouch(View v, MotionEvent event)来加载监听
- * 如果继承了Activity类,那就直接使用public boolean onTouchEvent(MotionEvent event) 吧。
- */
- }
运行效果:
当在屏幕上向左划,或者向右划,图片都会切换。
右边动画特效需要自己补上。