這可能是全網最好用的Banner輪播庫

一包純牛奶發表於2019-11-16

自上篇文章《打造一個絲滑般自動輪播無限迴圈Android庫》釋出之後BannerViewPager又迎來了眾多功能更新(還不瞭解BannerViewPager的同學可以戳上邊連結檢視)。現在的BannerViewPager已經具有非常豐富的API介面,功能十分強大。它幾乎可以支援市面上所有的Banner樣式。大家可以先下載Apk體驗,效果會比看GIF好很多哦!demo apk存放在github上,下載速度可能會比較慢。

點選或掃描二維碼下載apk

掃碼下載apk
接下來一起來看下BannerViewPager有哪些新增功能吧。

一.新增setPageStyle(int)

通過setPageStyle(int)一行程式碼開啟一屏三頁模式,一屏三頁模式下目前有三種樣式,分別如下圖所示:

MULTI_PAGE MULTI_PAGE_SCALE MULTI_PAGE_OVERLAP
MULTI_PAGE
MULTI_PAGE_SCALE
MULTI_PAGE_OVERLAP

點選檢視PageStyle示例程式碼

二.新增setIndicatorStyle(int)

同樣通過setIndicatorStyle(int)一行程式碼來改變indicator的樣式,目前BannerViewPager中內建CIRCLE和DASH兩種樣式。而BannerViewPager的強大之處在於當內建樣式不滿足需求的情況下可以通過setIndicatorView(IIndicator)來設定自定義的指示器(如圖:自定義),自定義指示器通過自定義View可實現任意的樣式哦!。

CIRCLE DASH 自定義
在這裡插入圖片描述
在這裡插入圖片描述
在這裡插入圖片描述

點選檢視IndicatorStyle示例程式碼

三.支援Indicator位置任意擺放。

指示器位於Banner下方
指示器位於Banner下方

上圖中將Indicator放在了Banner的下方。其實Indicator是支援擺放在任意位置的。之所以能做到任意擺放位置是因為自定義指示器替換了內建的IndicatorView,也就是說此時的IndicatorView已經脫離了BannerViewPager,也就理所當然的可以放在任意位置了。接下來通過程式碼來看下如何實現:

1.Xml佈局檔案如下

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.zhpan.bannerview.BannerViewPager
        android:id="@+id/banner_view"
        android:layout_width="match_parent"
        android:layout_height="180dp"
        android:layout_marginTop="20dp"
        app:bvp_page_style="multi_page" />

    <com.zhpan.bannerview.indicator.CircleIndicatorView
        android:id="@+id/indicator_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/banner_view"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp" />
 </RelativeLayout>
複製程式碼

2.通過setIndicatorView(IIndicator)替換指示器

    CircleIndicatorView indicatorView = findViewById(R.id.indicator_view);
 	mViewPager.setPageStyle(PageStyle.MULTI_PAGE_OVERLAP)
              .setIndicatorVisibility(View.GONE)
              .setIndicatorView(indicatorView)
              .setIndicatorColor(Color.parseColor("#888888"),
                   Color.parseColor("#118EEA"))
              .setPageMargin(BannerUtils.dp2px(10))
              .setRevealWidth(BannerUtils.dp2px(10))
              .setHolderCreator(() -> new ImageResourceViewHolder(BannerUtils.dp2px(5)))
              .create(mDrawableList);
複製程式碼

注意下面兩行程式碼

mViewPager.setIndicatorVisibility(View.GONE)
          .setIndicatorView(indicatorView)
複製程式碼

可以看到通過setIndicatorVisibility(View.GONE)隱藏了內部IndicatorView,在實際開發中是不需要新增這行程式碼的。因為在demo中切換不同的PageStyle時影響了BannerViewPager內部IndicatorView的建立,所以需要手動隱藏。但在實際開發中不必再呼叫setIndicatorVisibility(View.GONE)來隱藏內部的指示器

四.其它新增API

1.setCurrentItem(int item)與getCurrentItem()

在2.3.5版本中新新增的兩個API。

setCurrentItem(int item)切換到指定的頁面。

getCurrentItem()獲取當前頁面的position。

2.setPageMargin(int pageMargin)

在2.4.0版本中新新增了setPageMargin(int pageMargin),可以設定BannerViewPager頁面的間距。

3.setIndicatorMargin(int left, int top, int right, int bottom)

2.4.1版中中新增了設定setIndicatorMargin(int left, int top, int right, int bottom)的介面。便於調節IndicatorView距離BannerViewPager的距離。

4. setOnPageChangeListener(OnPageChangeListener l)

2.4.3(該版本目前暫未釋出)版本新增對於頁面狀態的監聽,可以方便在切面切換後做些操作,比如切換到最後一頁後顯示出一個Buttong。

5.disableTouchScroll(boolean disableTouchScroll)

同樣是在2.4.3(該版本目前暫未釋出)版本中新增disableTouchScroll,用來禁止手指滑動切換頁面。

五.未來計劃

未來版本中將針對目前存在的問題進行優化更新,並會著重提升BannerViewPager效能。文章末尾放原始碼連結,歡迎start。

原始碼戳此處

相關文章