Android ViewFlipper滑动屏幕切换

最近看到ViewFlipper和Animation在一起的用法，感觉很好，我就自己写了一下，感觉灰常好用，效果比gallery的滚动查看图片好用多了，这个也是实现滚动屏幕切换图片，但是用户体验要好很多！所以我把自己写的demo分享一下！希望对大家有用，也方便我自己以后查阅！转载请标明出处：

http://blog.csdn.net/wdaming1986/article/details/6766058

 

        程序一开始界面，第一张图片：                               向右滑动屏幕切换到第二张图片：

               

             



 

               向右滑动切换第三张图片：

        向左滑动就又切换到第二张图片了！

        以此类推！

      



  代码奉上：

一、MainActivity。java类文件：

[java] view
plaincopyprint?

package com.cn.daming;  

  

import android.app.Activity;  

import android.content.Intent;  

import android.graphics.Color;  

import android.graphics.drawable.GradientDrawable;  

import android.graphics.drawable.GradientDrawable.Orientation;  

import android.os.Bundle;  

import android.util.Log;  

import android.view.GestureDetector;  

import android.view.GestureDetector.OnGestureListener;  

import android.view.LayoutInflater;  

import android.view.MotionEvent;  

import android.view.View;  

import android.view.animation.AnimationUtils;  

import android.widget.ViewFlipper;  

  

public class MainActivity extends Activity implements OnGestureListener{  

      

    private GestureDetector detector;  

    private ViewFlipper flipper;  

    private final int HELPFILP_RESULT = 106;  

    Intent getMainActivity = null;  

    int count = 1;  

      

    @Override  

    public void onCreate(Bundle savedInstanceState) {  

        super.onCreate(savedInstanceState);  

        drawBackground();  

        LayoutInflater inflater = LayoutInflater.from(this);  

        final View layout = inflater.inflate(R.layout.view_flipper, null);  

        setContentView(layout);  

        flipper = (ViewFlipper) findViewById(R.id.view_flipper);  

        detector = new GestureDetector(this);  

    }  

  

    public void drawBackground()  

    {  

        GradientDrawable grad = new GradientDrawable(   

                   Orientation.TL_BR,  

                   new int[] {Color.rgb(0, 0, 127),  

                           Color.rgb(0, 0, 255),  

                           Color.rgb(127, 0, 255),  

                           Color.rgb(127, 127, 255),  

                           Color.rgb(127, 255, 255),  

                           Color.rgb(255, 255, 255)}   

        );   

  

        this.getWindow().setBackgroundDrawable(grad);  

    }  

      

    @Override  

    public boolean onTouchEvent(MotionEvent event) {  

        return this.detector.onTouchEvent(event);  

    }  

  

    public boolean onDown(MotionEvent arg0) {  

        // TODO Auto-generated method stub  

        return false;  

    }  

  

    public boolean onFling(MotionEvent e1, MotionEvent e2, float arg2,  

            float arg3) {  

        Log.i("Fling", "Fling Happened!");  

        if (e1.getX() - e2.getX() > 5) {  

            this.flipper.setInAnimation(AnimationUtils.loadAnimation(this,  

                    R.anim.push_left_in));  

            this.flipper.setOutAnimation(AnimationUtils.loadAnimation(this,  

                    R.anim.push_left_out));  

            if (count < 3) {  

                this.flipper.showNext();  

                count++;  

            }  

  

            return true;  

        } else if (e1.getX() - e2.getX() < -5) {  

            this.flipper.setInAnimation(AnimationUtils.loadAnimation(this,  

                    R.anim.push_right_in));  

            this.flipper.setOutAnimation(AnimationUtils.loadAnimation(this,  

                    R.anim.push_right_out));  

            if (count > 1) {  

                this.flipper.showPrevious();  

                count--;  

            }  

            return true;  

        }  

        return true;  

    }  

  

    public void onLongPress(MotionEvent arg0) {  

        // TODO Auto-generated method stub  

          

    }  

  

    public boolean onScroll(MotionEvent arg0, MotionEvent arg1, float arg2,  

            float arg3) {  

        // TODO Auto-generated method stub  

        return false;  

    }  

  

    public void onShowPress(MotionEvent arg0) {  

        // TODO Auto-generated method stub  

          

    }  

  

    public boolean onSingleTapUp(MotionEvent arg0) {  

        // TODO Auto-generated method stub  

        return false;  

    }  

}  

 

二、view_flipper.xml布局文件

[html] view
plaincopyprint?

<?xml version="1.0" encoding="utf-8"?>  

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  

    android:id="@+id/layout" android:orientation="horizontal"  

    android:layout_width="fill_parent" android:layout_height="fill_parent"  

    >  

    <ViewFlipper android:id="@+id/view_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="horizontal"   

            android:layout_width="fill_parent" android:layout_height="fill_parent">  

            <ImageView android:id="@+id/view_bg1" android:src="@drawable/bg1"  

                android:layout_width="fill_parent" android:layout_height="fill_parent"  

                >  

            </ImageView>  

        </LinearLayout>  

        <LinearLayout android:orientation="horizontal"   

            android:layout_width="fill_parent" android:layout_height="fill_parent">  

            <ImageView android:id="@+id/view_bg2" android:src="@drawable/bg2"  

                android:layout_width="fill_parent" android:layout_height="fill_parent"  

                >  

            </ImageView>  

        </LinearLayout>  

        <LinearLayout android:orientation="horizontal"  

            android:layout_width="fill_parent" android:layout_height="fill_parent">  

            <ImageView android:id="@+id/view_bg3" android:src="@drawable/bg3"  

                android:layout_width="fill_parent" android:layout_height="fill_parent"  

            >  

            </ImageView>  

        </LinearLayout>  

    </ViewFlipper>  

</LinearLayout>   

 

三、anim动画布局文件：

       1、push_left_in.xml布局文件：

[html] view
plaincopyprint?

<span style="font-size:13px;"><?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.1" android:toAlpha="1.0"  

                android:duration="500" />  

</set></span>  

[html] view
plaincopyprint?

<strong>  

</strong>   

       2、push_left_out.xml布局文件

[html] view
plaincopyprint?

<?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.1"  

                android:duration="500" />  

</set>  

       3、push_right_in.xml布局文件

[html] view
plaincopyprint?

<span style="font-size:13px;color:#000000;"><?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.1" android:toAlpha="1.0"  

                android:duration="500" />  

</set></span>  

 

       4、push_right_out.xml布局文件

[html] view
plaincopyprint?

<?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.1"  

                android:duration="500" />  

</set>