Android 中 ViewFlipper 的簡單實例

main.xml<喎?/kf/ware/vc/" target="_blank" class="keylink">vcD4NCjxwcmUgY2xhc3M9"brush:java;">

Main.java

package com.wty.mydemoviewflipper;

import android.app.Activity;
import android.os.Bundle;

import com.wty.mydemoviewflipper.wiget.ViewFlipperView;

public class Main extends Activity {

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(new ViewFlipperView(this));
    }
}

IAdImages.java

package com.wty.mydemoviewflipper.wiget;

import com.wty.mydemoviewflipper.R;

/**
 * 圖片信息接口
 * @author vhreal
 *
 */
public interface IAdImages {

    /**
     * 廣告圖片
     */
    int[] adImages = {
            R.drawable.img01, R.drawable.img02, R.drawable.img03, R.drawable.img04, R.drawable.img05,
            R.drawable.img06, R.drawable.img07, R.drawable.img08, R.drawable.img09, R.drawable.img10
    };
}

ViewFlipperView.java

package com.wty.mydemoviewflipper.wiget;

import android.content.Context;
import android.view.Gravity;
import android.view.MotionEvent;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ViewFlipper;

import com.wty.mydemoviewflipper.R;

/**
 * 這是一個類似於ViewFlipper的Wiget。
 * @author vhreal
 *
 */
public class ViewFlipperView extends FrameLayout implements IAdImages {

    private Context context;                           // 調用方的上下文
    private int currentAdImgIndex;                     // 當前廣告圖片索引
    private Animation left2RightInAnimation;           // 廣告圖片從左到右進入屏幕動畫
    private Animation left2RightOutAnimation;          // 廣告圖片從左到右出去屏幕動畫
    private Animation right2LeftInAnimation;           // 廣告圖片從右到左進入屏幕動畫
    private Animation right2LeftOutAnimation;          // 廣告圖片從右到左出去屏幕動畫
    private int animationDuration = 300;               // 動畫花費時間1000毫秒
    private ViewFlipper mViewFlipper;                  // 滑動頁面控件
    private LinearLayout mTipLinearLayout;             // 下方點點控件
    private float startX = 0;                          // touch action down 時的x坐標
    private float endX = 0;                            // touch action up 時的x坐標

    public ViewFlipperView(Context context) {
        super(context);
        this.context = context;
        setView();
    }

    /**
     * 顯示View
     */
    private void setView(){

        // 初始化
        int screenWidth = getResources().getDisplayMetrics().widthPixels;
        mViewFlipper = new ViewFlipper(context);
        mTipLinearLayout = new LinearLayout(context);
        // 初始化動畫
        left2RightInAnimation = new TranslateAnimation(-screenWidth, 0, 0, 0);
        left2RightInAnimation.setDuration(animationDuration);
        left2RightOutAnimation = new TranslateAnimation(0, screenWidth, 0, 0);
        left2RightOutAnimation.setDuration(animationDuration);
        right2LeftInAnimation = new TranslateAnimation(screenWidth, 0, 0, 0);
        right2LeftInAnimation.setDuration(animationDuration);
        right2LeftOutAnimation = new TranslateAnimation(0, -screenWidth, 0, 0);
        right2LeftOutAnimation.setDuration(animationDuration);


        // 將廣告圖片加入ViewFlipper
        for(int i=0; i 0 && endX > startX){// 查看前一頁的廣告

                mViewFlipper.setInAnimation(left2RightInAnimation);
                mViewFlipper.setOutAnimation(left2RightOutAnimation);
                mViewFlipper.showPrevious();
                currentAdImgIndex--;
                if(currentAdImgIndex < 0){
                    currentAdImgIndex = 0;
                }
            }

            if(currentAdImgIndex < adImages.length-1 && endX < startX){// 查看後一頁的廣告

                mViewFlipper.setInAnimation(right2LeftInAnimation);
                mViewFlipper.setOutAnimation(right2LeftOutAnimation);
                mViewFlipper.showNext();
                currentAdImgIndex++;
                if(currentAdImgIndex > adImages.length-1){
                    currentAdImgIndex = adImages.length-1;
                }
            }

            // 根據currentAdImgIndex改變底部點的狀態
            ImageView currTipImageView = (ImageView) mTipLinearLayout.getChildAt(currentAdImgIndex);
            lastTipImageView.setImageResource(R.drawable.point_normal);
            currTipImageView.setImageResource(R.drawable.point_selected);

            break;      
        }   
        return true;
    }
}