解析Android中實現滑動翻頁之ViewFlipper的使用詳解

來源:互聯網
上載者:User

1)View切換的控制項—ViewFlipper介紹

ViewFilpper類繼承於ViewAnimator類。而ViewAnimator類繼承於FrameLayout。

查看ViewAnimator類的源碼可以看出此類的作用主要是為其中的View切換提供動畫效果。該類有如下幾個和動畫相關的方法。

setInAnimation:設定View進入螢幕時候使用的動畫。該方法有兩個重載方法,即可以直接傳入Animation對象,也可以傳入定義的Animation檔案的resourceID。

setOutAnimation:設定View退出螢幕時候使用的動畫。使用方法和setInAnimation方法一樣。

showNext:調用該方法可以顯示FrameLayout裡面的下一個View。

showPrevious:調用該方法可以來顯示FrameLayout裡面的上一個View。

查看ViewFlipper的源碼可以看到,ViewFlipper主要用來實現View的自動切換。該類提供了如下幾個主要的方法。

setFilpInterval:設定View切換的時間間隔。參數為毫秒。

startFlipping:開始進行View的切換,時間間隔是上述方法設定的間隔數。切換會迴圈進行。

stopFlipping:停止View切換。

setAutoStart:設定是否自動開始。如果設定為“true”,當ViewFlipper顯示的時候View的切換會自動開始。

一般情況下,我們都會使用ViewFilpper類實現View的切換,而不使用它的父類ViewAnimator類。

2)實現滑動—GestureDetector介紹

如果想要實現滑動翻頁的效果,就要瞭解另外一個類:android.view.GestureDetector類。GestureDetector類中可以用來檢測各種手勢事件。該類有兩個回調介面,分別用來通知具體的事件。

GestureDetector.OnDoubleTapListener:用來通知DoubleTap事件,類似於PC上面的滑鼠的雙擊事件。

GestureDetector.OnGestureListener:用來通知普通的手勢事件,該介面有六個回調方法,具體的可以查看API。這裡想要實現滑動的判斷,就需要用到其中的onFling()方法。

3)具體的實現

下面的程式碼片段詳細說明了如何?滑動翻頁。

複製代碼 代碼如下:public class ViewFlipperActivity extends Activity implements OnGestureListener {

private static final int FLING_MIN_DISTANCE = 100;
private ViewFlipper flipper;
private GestureDetector detector;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.viewflipper);
// 註冊一個GestureDetector
detector = new GestureDetector(this);
flipper = (ViewFlipper) findViewById(R.id.ViewFlipper);
ImageView image1 = new ImageView(this);
image1.setBackgroundResource(R.drawable.image1);
// 增加第一個view
flipper.addView(image1);
ImageView image2 = new ImageView(this);
image2.setBackgroundResource(R.drawable.image2);
// 增加第二個view
flipper.addView(image2);
}

@Override
public boolean onTouchEvent(MotionEvent event) {
// 將觸屏事件交給手勢識別類處理
return this.detector.onTouchEvent(event);
}

@Override
public boolean onDown(MotionEvent e) {
return false;
}

@Override
public void onShowPress(MotionEvent e) {
}

@Override
public boolean onSingleTapUp(MotionEvent e) {
return false;
}

@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
float distanceY) {
return false;
}

@Override
public void onLongPress(MotionEvent e) {
}

@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
float velocityY) {
if (e1.getX() - e2.getX() > FLING_MIN_DISTANCE) {
//設定View進入和退出的動畫效果
this.flipper.setInAnimation(AnimationUtils.loadAnimation(this,
R.anim.left_in));
this.flipper.setOutAnimation(AnimationUtils.loadAnimation(this,
R.anim.left_out));
this.flipper.showNext();
return true;
}
if (e1.getX() - e2.getX() < -FLING_MIN_DISTANCE) {
this.flipper.setInAnimation(AnimationUtils.loadAnimation(this,
R.anim.right_in));
this.flipper.setOutAnimation(AnimationUtils.loadAnimation(this,
R.anim.right_out));
this.flipper.showPrevious();
return true;
}
return false;
}
}

在這段代碼裡,建立了兩個IamgeView(用來顯示圖片),加入到了ViewFlipper中。程式運行後,當用手指在螢幕上向左滑動,會顯示前一個圖片,用手指在螢幕上向右滑動,會顯示下一個圖片。實現滑動切換的主要代碼都在onFling()方法中,使用者按下觸控螢幕,快速移動後鬆開,就會觸發這個事件。在這段程式碼範例中,對手指滑動的距離進行了計算,如果滑動距離大於100像素,就做切換動作,否則不做任何切換動作。

可以看到,onFling()方法有四個參數,e1和e2上面代碼用到了,比較好理解。參數velocityX和velocityY是做什麼用的呢?velocityX和velocityY實際上是X軸和Y軸上的移動速度,單位是像素/秒。結合這兩個參數,可以判斷滑動的速度,從而做更多的處理。

為了顯示出滑動的效果,這裡調用了ViewFlipper的setInAnimation()和setOutAnimation()方法設定了View進入和退出的動畫。對於動畫的使用,這裡不再贅述,也不再給出具體的XML檔案代碼了。

另外,在上面的代碼基礎上說些額外的話題。

在Xml布局檔案中,我們既可以設定像素px,也可以設定dp(或者dip)。

一般情況下,我們都會選擇使用dp,這樣可以保證不同螢幕解析度的手機上布局一致。但是在代碼中,一般是無法直接使用dp的。

拿上面的代碼為例,代碼中定義了滑動的距離閥值為100像素。這就會導致不同解析度的手機上效果有差別。比如在240X320的機型上,和在480X800的機型上,想要切換View,需要手指滑動的距離是不同的。所以,一般情況下,建議在代碼中,也不要用像素,也用dp。

那麼既然無法直接用dp,就需要從px轉換成dp了。其實px和dp之間是有公式可以相互轉換的。(基於Android中dp和px之間進行轉換的實現代碼)已經寫過了,可以直接參考

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.