ViewFlipper探索與使用——順便實現Android圖片輪播

Wing_Li發表於2018-12-03
ViewAndroid

如果本文幫助到你，本人不勝榮幸，如果浪費了你的時間，本人深感抱歉。 希望用最簡單的大白話來幫助那些像我一樣的人。如果有什麼錯誤，請一定指出，以免誤導大家、也誤導我。 本文來自：www.jianshu.com/users/320f9… 感謝您的關注。

前段時間偶然看到一個使用 ViewFlipper 實現圖片輪播的。 我承認，之前我是沒有聽過 ViewFlipper 這個東西的。那麼我腦海中就出現了一個問題：ViewFlipper 是個什麼東西？為什麼繼承它能實現圖片的輪播。然後有了之後的探索，我們一起來看看。

分析 ViewFlipper

在 studio 中 F4 檢視層級關係，經過一番尋找之後有了下圖。 呦呵，看到了熟人。ViewFlipper 我沒見過，但是我見過 TextSwitcher 和 ImageSwitcher 啊，他兩都是內容改變時有個動畫的效果。

ViewFlipper探索與使用——順便實現Android圖片輪播

分析 TextSwitcher 、ImageSwitcher

層級關係

首先看上圖最右邊的層級關係，通過 ViewFlipper 找到了 TextSwitcher 和ImageSwitcher 。他們有一個共同的父類 ViewAnimator ，也就是說他們肯定是有關聯的，而且應該是很相近。

提供的功能

既然 TextSwitcher 和 ImageSwitcher ，我們認識，那麼我們就小小的分析一下這兩個類。他兩提供的功能基本相同，只不過一個針對文字，一個對圖片。這兩個類本身也是非常簡單，提供的方法在左邊的目錄可以看到，還有一些在父類裡。

內容

因為類本身比較簡單，所以類裡面的程式碼也沒有多少。 我們看中間的程式碼視窗，除了構造器剩餘的方法一目瞭然。 可以發現，最終都是呼叫了 showNext() 顯示切換後的內容，而 showNext() 是由他們的共同父類 ViewAnimator 執行的，而 ViewAnimator 本身就是一個管理動畫的類。

也就是說，我們今天的主角 ViewFlipper 最終應該也是呼叫 showNext() 來執行動畫的。 那 ViewFlipper 跟他們到底有什麼區別呢？ 我們來看下面的圖，對 ViewFlipper 的分析。

ViewFlipper探索與使用——順便實現Android圖片輪播

層級關係

這個我們之前已經看過了。

提供的功能

可以看到最左邊的目錄明顯比上面要多很多東西（其實上面兩個是有個父類幫他們分擔了，但是這個功能還是比他多(^__^)）。

內容

那最根本的區別到底是什麼呢？ 看中間的內容，我們就發現，在這個類當中是有個 Handler Message 存在的。也就是說我們可以設定定時播放動畫，也正是基於此，該類才比上面多了一些功能。 開始、結束動畫，是否自動播放，間隔時間，都是上面的所不具備的。

這樣一波看下來，我們大概就知道了 ViewFlipper 為什麼能用來實現輪播了。

那 ViewFlipper 到底該怎麼使用呢？

使用 ViewFlipper 實現輪播

嗯....... 還是直接上程式碼吧，註釋很詳細一目瞭然。

private void setViewFlipper() {
    mViewFlipper = (ViewFlipper) findViewById(R.id.flipper);

    //新增要滾動的View
    mViewFlipper.addView(getImageView(R.drawable.abcde_a));
    mViewFlipper.addView(getImageView(R.drawable.abcde_b));
    mViewFlipper.addView(getImageView(R.drawable.abcde_c));

    //設定開始和結束動畫
    mViewFlipper.setInAnimation(this, R.anim.push_up_in);
    mViewFlipper.setOutAnimation(this, R.anim.push_up_out);

    //設定間隔時間
    mViewFlipper.setFlipInterval(3000);

    //動畫的監聽
    mViewFlipper.getInAnimation().setAnimationListener(new Animation.AnimationListener() {
        @Override
        public void onAnimationStart(Animation animation) {
            //動畫開始時
        }

        @Override
        public void onAnimationEnd(Animation animation) {
            //動畫結束時
        }

        @Override
        public void onAnimationRepeat(Animation animation) {
            //重複
        }
    });

    //開始輪播
    mViewFlipper.startFlipping();
}

private ImageView getImageView(int res) {
    ImageView imageView = new ImageView(this);
    imageView.setBackgroundResource(res);
    return imageView;
}
複製程式碼

有了 setInAnimation() 、 setOutAnimation()，這兩個方法的存在，我們就可以設定各種各樣的自己想要的動畫效果，而其餘提供的方法，更是讓我們非常方便的控制動畫。有沒有覺得很不錯呢？

你有沒有什麼好的想法？ 可以自己去動手實踐看看。

ViewFlipper 常用方法

setInAnimation      設定View進入螢幕時候使用的動畫
setOutAnimation     設定View退出螢幕時候使用的動畫
showPrevious        顯示ViewFlipper裡面的上一個View
showNext            顯示ViewFlipper裡面的下一個View
setFlipInterval     設定View之間切換的時間間隔
startFlipping       使用setFlipInterval方法設定的時間間隔來開始切換所有的View,切換會迴圈進行
stopFlipping        停止View切換
isFlipping          用來判斷View切換是否正在進行
setDisplayedChild   切換到指定子View
複製程式碼

***

之前在群裡，聽到有人問：已經有 ViewPager 了，ViewFlipper還有沒有存在的必要？ 看完本篇之後，還有沒有這樣的疑問？ ViewFlipper 是為了動畫而生的，但是 ViewPager 呢？

好了，本篇就到這裡。 O(∩_∩)O

相關程式碼：ViewAnimation github.com/Wing-Li/And…


相關文章