使用ViewFlipper實現屏幕滾動切換動畫

使用ViewFlipper實現屏幕滾動切換動畫

標籤（空格分隔）： ViewFlipper Android 自動切換

---

Android系統自帶的一個多頁面管理控件，可以實現子界面的自動切換。

使用ViewFlipper實現圖片輪播

1.靜態導入：在layout佈局文件中直接導入

<ViewFlipper
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/viewFlipper">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/ex2"
            android:scaleType="matrix"/>

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/ex3"
            android:scaleType="matrix"/>

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/ex4"
            android:scaleType="matrix"/>
    </ViewFlipper>

2.動態導入
addView（)方法

flipper=(ViewFlipper)findViewById(R.id.flipper);
flipper.addView(getImageView(R.drawble.pic1));
flipper.addView(getImageView(R.drawble.pic2));
flipper.addView(getImageView(R.drawble.pic3));
flipper.addView(getImageView(R.drawble.pic4));

3.ViewFlipper常用方法

setInAnimation: 設置View進入屏幕時的動畫
setOutAnimation: 設置View退出屏幕時的動畫
showNext： 調用該函數來顯示ViewFlipper裏的下一個View
showPrevious: 調用該函數來顯示ViewFlipper裏的上一個View
setFlipInterval： 設置View之間切換的時間間隔
startFlipping: 使用上面設置的時間間隔來開始切換所有的View，切換後會循環進行
stopFlipper: 停止View切換

ViewFlipperActivity.java

package com.excavator.viewflipperdemo;

import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.widget.ImageView;
import android.widget.ViewFlipper;

public class ViewFlipperActivity extends Activity {

    private ViewFlipper mFlipper;
    private int[] resId = {R.drawable.pic1, R.drawable.pic2, R.drawable.pic3, R.drawable.pic4};
    private float startX;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_view_flipper);
        mFlipper= (ViewFlipper) findViewById(R.id.flipper);
        //動態導入方式加入子View
        for (int id:resId) {
            mFlipper.addView(getImageView(id));
        }
        /*//爲ViewFlipper添加動畫效果
        mFlipper.setInAnimation(this, R.anim.left_in);
        mFlipper.setOutAnimation(this, R.anim.left_out);
        //設置時間間隔
        mFlipper.setFlipInterval(3000);
        mFlipper.startFlipping();*/
    }

    //手勢滑動
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()){
            //落下
            case MotionEvent.ACTION_DOWN:
                startX = event.getX();
                break;
            //滑動
            case MotionEvent.ACTION_MOVE:
                if (event.getX()-startX>100) {  //向右滑動看前一頁
                    mFlipper.setInAnimation(this,R.anim.left_in);
                    mFlipper.setOutAnimation(this,R.anim.left_out);
                    mFlipper.showPrevious();
                }else if (startX-event.getX()>100) {    //向左滑動看後一頁
                    mFlipper.setInAnimation(this, R.anim.right_in);
                    mFlipper.setOutAnimation(this, R.anim.right_out);
                    mFlipper.showNext();
                }
                break;
            //離開
            case MotionEvent.ACTION_UP:
                break;
        }
        return super.onTouchEvent(event);
    }

    private ImageView getImageView(int resId) {
        ImageView image = new ImageView(this);
//        image.setImageResource(resId);
        image.setBackgroundResource(resId);
        return image;
    }
}