概述

使用android手機肯定很喜歡用手指把畫面拖來拖去的感覺。這樣的切換畫面讓人非常友善。在很多App的第一次啟動時的引導頁都有類似效果。

控件

ViewFlipper 視圖的切換容器視圖，它有很多子視圖，可以使用showPrevious，showNext來向前或者向後切換視圖，不過是沒有動畫效果的
Animation 為切換增加動畫
GestureDetector 手勢偵查器，他提供了手勢的一些事件，它封裝了一些手指在螢幕的移動方向的處理，轉換成相應的事件

實作步驟：

寫一個窗體，放置一個ViewFlipper 在視圖裡。并為ViewFlipper 添加子視圖。

<ViewFlipper android:layout_width="fill_parent"     
      android:id="@+id/viewFlipper2" 
      android:layout_height="fill_parent">

    <LinearLayout android:id="@+id/linearLayout1"     
    android:layout_width="wrap_content"     
    android:layout_height="wrap_content">
    <TextView android:text="第一"   
        android:id="@+id/textView1"             
        android:layout_width="wrap_content"          
        android:layout_height="wrap_content">
    </TextView>
    </LinearLayout>
    <LinearLayout android:id="@+id/linearLayout2" 
          android:layout_width="wrap_content"
         android:layout_height="wrap_content">
          <TextView android:text="第二"     
                android:id="@+id/textView2"              
               android:layout_width="wrap_content" 
                android:layout_height="wrap_content"></TextView>
        <  /LinearLayout>

       <LinearLayout android:id="@+id/linearLayout3" 
            android:layout_width="wrap_content"
           android:layout_height="wrap_content">

        <TextView android:text="第三" 
            android:id="@+id/textView3"
             android:layout_width="wrap_content"
               android:layout_height="wrap_content">
          </TextView>
    </LinearLayout>
</ViewFlipper>

複制

注冊窗體的 onTouchEvent事件，這個事件會在窗體被觸摸時觸發。在這個事件觸發後，将事件觸發後的參數扔給一個GestureDetector對象來處理。
準備一個GestureDetector對象，為第一步來使用。GestureDetector對象将使用者的，時候觸摸動作轉換成相應的手勢事件。這些事件有：

onDown，onFling，onLongPress，onScroll，onShowPress，onSingleTapUp。本文我們隻用到onFling手勢
處理onFling手勢的操作。onFling事件觸發時，由作業系統傳入的參數有MotionEvent e1, MotionEvent e2, float velocityX, float velocityY。參數e1,和e2，是手勢觸發的開始位置和結束位置。就是你的手指第一次點選，和最後離開的螢幕坐标位置。我們用e1,和e2，來判斷使用者是從左到友移動了手指或者從友到左移動了手指。判斷的方法為：

float x1 = e1.getX();

float x2 = e2.getX();

if (x1 - x2 < -100) //從左往右拖動，100代表長度。 { .... } else if (x1 - x2 > 100) {//從右往左拖動，100代表長度 ... }

5.由于判斷了手勢，那麼我們可以對ViewFlipper的子視圖進行切換了，方法如下

//讓flipper 前移
this.ViewFlipper1.showPrevious();

複制

如何處理動畫呢？

為flipper(ViewFlipper )指定一個animation 對象就可以了。

Animation animation = 
                AnimationUtils.loadAnimation(getApplicationContext(), R.anim.filp_l2r);
                //指定一個動畫
      this.flipper.setAnimation(animation);

複制

如上代碼所示AnimationUtils.loadAnimation指定一個動畫描述的資源檔案。我們的動畫效果是在這裡的資源檔案裡描述的。

從左往右的動畫

<?xml version="1.0" encoding="utf-8"?>
  <set     xmlns:android="http://schemas.android.com/apk/res/android">  
<translate  
      android:fromXDelta="0%p"  
      android:toXDelta="100%p"  
      android:duration="1000" />  
</set>

複制

從右往左的效果

<?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%p"  
    android:duration="1000" />  
</set>

複制

fromXDelta是開始的x坐标，是相對于螢幕窗體的坐标位置。toXDelta是結束位置。duration是延遲時間。

完整的代碼下載下傳

Android開發(8) 使用ViewFlipper來用手勢切換視圖概述控件實作步驟：

概述

控件

實作步驟：