BtCarousel輪播組件 - 一款易於使用,定製化的輪播組件

BtCarousel

A Carousel Easy To Use

項目地址BtCarousel
個人博客 BT SPACE
我的 github

演示

演示圖片

圖片幀數較低諒解~

背景:

筆者公司的業務代碼屬於比較定製化的類型,即針對於某一環境所編寫的代碼,無法進行代碼重用,並且如果需求有更改,代碼改動量也極其巨大

一直都有想法去編寫一些耦合性比較低的組件供日常使用,對以後的工作和學習來說都是事半功倍

使用:

Step1 : 將以下佈局加入layout中,寬高可以自行設定或者使用 CarouselView..scale(float scale)方法進行比例設置.

<com.bt.carousel.carousel.Carousel.view.CarouselView
        android:id="@+id/carousel_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center">
</com.bt.carousel.carousel.Carousel.view.CarouselView>

Step2 : 自定義Apdapter繼承自CarouselAdapter

public class CarouselAdapter extends CarouselBaseAdapter {

    public CarouselAdapter(Context context) {
        super(context);
    }

    /**
     * @param viewHolder
     * @param position
     * 設置根視圖以及元素,點擊事件等
     */
    @Override
    protected void convert(PagerViewHolder viewHolder, final int position) {
        viewHolder.setConvertView(R.layout.item).setImageResource(R.id.home_banner_item_img,
                getData().get(position).toString(),R.drawable.default_bg,R.drawable.default_bg);     
    }
}

convert方法內綁定視圖及設定內容使用鏈式調用方法.
- setConvertView(@LayoutRes int layoutId) (必需) 設定每個item的根視圖
- setText(@IdRes int viewId, CharSequence value) 設置對應viewId的填充文本
- setImageResource(@IdRes int viewId, @DrawableRes int imageResId) 設置對應viewId的背景圖/drawable(本地)
- setImageResource(@IdRes int viewId,CharSequence imageUrl, @DrawableRes int defaultImageResId,@DrawableRes int errorImageResId) 設置對應viewId加載網絡圖片,默認佔位圖及錯誤佔位圖.如不需要可將參數置0

Step3 : 實例化Apdater,ViewPager,Indicator(可選)並與CarouselView的實例進行綁定.

//獲取實例
mCarouselView = (CarouselView) findViewById(R.id.carousel_view);
//實例化adapter
CarouselAdapter carouselAdapter = new CarouselAdapter(this);
//實例化ViewPager
BtViewPager viewPager = new BtViewPager(this);
//構建viewPager
viewPager.build();
//實例化Indicator ,此處使用圓形canvas繪製
CanvasIndicator canvasIndicator = new CanvasIndicator(this,CanvasIndicator.CIRCLE_STYLE);
//構建Indicator
canvasIndicator.build();
//輪播構建
mCarouselView.viewPager(viewPager).adapter(carouselAdapter).indicator(canvasIndicator).build();

Finish : 輪播正常顯示啦.或許現在的界面很醜,你可以通過以下方法去定製.


擴展

每個組件內部均可自行定製.高度可擴展並且不會出現兼容問題.

更新日誌

2018-6-29

  • 代碼重構,組件各自獨立,降低耦合.
  • 組件優化,可自行選擇需要的組件進行加載.
  • 代碼優化,剔除冗餘代碼,代碼高效利用.
  • 修改作者名稱.(原工號)

2018-6-18

  • 修復設置樣式後無法立即生效的BUG
  • 修復canvas繪製有延遲的BUG
  • 目錄改動,按類型分類
  • 增加樣式設置方法
  • 增加演示界面
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章