Тайлбар байхгүй

zhpanvip 3efdea0e39 Update README		5 жил өмнө
.github	ef9a4120b2 Update FUNDING.yml	5 жил өмнө
app	3efdea0e39 Update README	5 жил өмнө
bannerview	3efdea0e39 Update README	5 жил өмнө
gradle	e7cb5adf1a dev 3.0.1 (#110)	5 жил өмнө
ideahttp	454ee03539 New Api disableTouchScroll (#28)	5 жил өмнө
.gitignore	85df0692f4 optimize sliding conflict (#99)	5 жил өмнө
LICENSE	63fc39d7a5 Create LICENSE	5 жил өмнө
README.md	3efdea0e39 Update README	5 жил өмнө
README_CN.md	3efdea0e39 Update README	5 жил өмнө
build.gradle	e7cb5adf1a dev 3.0.1 (#110)	5 жил өмнө
git	16134c571c 优化demo	5 жил өмнө
gradle.properties	88c09a7271 Migrate to androidx	5 жил өмнө
gradlew	7cd1aff3e4 add Annotation for IndicatorGravity	5 жил өмнө
gradlew.bat	8fce1800a5 Initial commit	8 жил өмнө
settings.gradle	9ba615c084 Fix a bug,that Banner can't display when get data from server.	5 жил өмнө

BannerViewPager

English | 中文

Tencent Video,QQ Music,KuGou,AliPay,Tmall,TaoBao,YouKu,Himalaya,NetEase Music,Bilibili ect. All of above App's Banner can be implements By BannerViewPager.

What's new in version 3.0

Migrate to ViewPager2
Mutiple item type supported
setOrientation supported
addPageTransformer and removeTransformer supported
setAdapter replaces setHolderCreator
getData replaces getList
registerOnPageChangeCallback replaces setOnPageChangeListener
setUserInputEnabled replaces disableTouchScroll
remove setPageTransformerStyle
remvoe some deprecate methods in 2.x

Preview

### Click here or scan the QR code to download demo apk

1.PageStyle

Sample Click Here

| MULTI_PAGE |MULTI_PAGE_SCALE | MULTI_PAGE_OVERLAP | |--|--|--| | | | |

2.Indicator

The Indicator library was split from BannerViewPager,the new repo is ViewPagerIndicator，Click the link to see more information about ViewPagerIndicator

(1)setIndicatorStyle and setIndicatorSlideMode

BannerViewPager supports three Indicator Styles and three Indicator Slide mode now.

Sample Click Here

(2)Custom Indicator

It's also support to custom indicator style,just need extends BaseIndicatorView or implement the IIndicator and override methods, then you can draw Indicators for whatever you want.

Sample Click Here

| Figure Indicator | Drawable Indicator | Indicator below of Banner | |--|--|--| | | | |

API

Attributes

Useage

Since Viewpager2 does not support android support library, So since the version 3.0 is no longer supports android support library too. If you are still using android support, please use BannerViewPager v2.x

1.Gradle dependency

Add it in your root build.gradle at the end of repositories:

allprojects {
		repositories {
			...
			maven { url 'https://jitpack.io' }
		}
	}

Then Add the dependency

implementation 'com.github.zhpanvip:BannerViewPager:latestVersion'

latestVersion:

2.Add BannerViewPager in layout.xml

    <com.zhpan.bannerview.BannerViewPager
            android:id="@+id/banner_view"
            android:layout_width="match_parent"
            android:layout_margin="10dp"
            android:layout_height="160dp" />

3.The item layout of banner:

Attention:The layout width and height required "match_parent".Otherwise,the ViewPager2 will throws a IllegalStateException.

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

        <ImageView
            android:id="@+id/banner_image"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:background="#66000000"
            android:gravity="center_vertical">

            <TextView
                android:id="@+id/tv_describe"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_gravity="center_vertical"
                android:layout_marginStart="15dp"
                android:gravity="center_vertical"
                android:paddingTop="5dp"
                android:paddingBottom="5dp"
                android:textColor="#FFFFFF"
                android:textSize="16sp" />
        </LinearLayout>

    </RelativeLayout>

4.Extends BaseViewHolder,and override methods.

Attention:Don't use {@link RecyclerView.ViewHolder#getAdapterPosition} method to get position in ViewHolder，this method will return a fake position.

    public class NetViewHolder extends BaseViewHolder<BannerData> {

        public NetViewHolder(@NonNull View itemView) {
            super(itemView);
            CornerImageView imageView = findView(R.id.banner_image);
            imageView.setRoundCorner(BannerUtils.dp2px(0));
        }

        @Override
        public void bindData(BannerData data, int position, int pageSize) {
            CornerImageView imageView = findView(R.id.banner_image);
            Glide.with(imageView).load(data.getImagePath()).placeholder(R.drawable.placeholder).into(imageView);
        }
    }

5.Extends BaseBannerAdapter,and override methods

public class HomeAdapter extends BaseBannerAdapter<BannerData, NetViewHolder> {
    @Override
    protected void onBind(NetViewHolder holder, BannerData data, int position, int pageSize) {
        holder.bindData(data, position, pageSize);
    }

    @Override
    public NetViewHolder createViewHolder(View itemView, int viewType) {
        return new NetViewHolder(itemView);
    }

    @Override
    public int getLayoutId(int viewType) {
        return R.layout.item_net;
    }
}

5.Use in Activity or Fragment:

    private BannerViewPager<CustomBean, NetViewHolder> mBannerViewPager;
    ...
	private void initViewPager() {
             mBannerViewPager = findViewById(R.id.banner_view);
             mViewPager
                      .setAutoPlay(true)
                      .setIndicatorStyle(IndicatorStyle.ROUND_RECT)
                      .setIndicatorSliderGap(getResources().getDimensionPixelOffset(R.dimen.dp_4))
                      .setIndicatorSliderWidth(getResources().getDimensionPixelOffset(R.dimen.dp_4), getResources().getDimensionPixelOffset(R.dimen.dp_10))
                      .setIndicatorSliderColor(getColor(R.color.red_normal_color), getColor(R.color.red_checked_color))
                      .setOrientation(ViewPager2.ORIENTATION_VERTICAL)
                      .setInterval(2000)
                      .setAdapter(new HomeAdapter())
                      .registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
                          @Override
                          public void onPageSelected(int position) {
                              super.onPageSelected(position);
                              BannerData bannerData = mViewPagerHorizontal.getData().get(position);
                              mTvTitle.setText(bannerData.getTitle());
                          }
                      }).create(getPicList(4));
        }

6.startLoop and stopLoop

If the version you used is later than 2.5.0,you don't need care of startLoop and stopLoop in Activity or Fragment. But the two methods is still public.

Recommend call stopLoop in onPause() and startLoop in onResume() to improve performance：

    @Override
    protected void onPause() {
        if (mBannerViewPager != null)
                mBannerViewPager.stopLoop();
        super.onPause();
    }

    @Override
    protected void onResume() {
        super.onResume();
        if (mBannerViewPager != null)
            mBannerViewPager.startLoop();
    }

7.Custom IndicatorView

The example will implement an custom IndicatorView as the follow gif.

| Custom IndicatorView Style| |--| | |

(1)Custom View and extends BaseIndicatorView

public class FigureIndicatorView extends BaseIndicatorView {

    private int radius = DpUtils.dp2px(20);

    private int backgroundColor = Color.parseColor("#88FF5252");

    private int textColor = Color.WHITE;

    private int textSize=DpUtils.dp2px(13);

    public FigureIndicatorView(Context context) {
        this(context, null);
    }

    public FigureIndicatorView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public FigureIndicatorView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        mPaint = new Paint();
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        setMeasuredDimension(2 * radius, 2 * radius);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        mPaint.setColor(backgroundColor);
        canvas.drawCircle(getWidth() / 2, getHeight() / 2, radius, mPaint);
        mPaint.setColor(textColor);
        mPaint.setTextSize(textSize);
        String text = currentPosition + 1 + "/" + pageSize;
        int textWidth = (int) mPaint.measureText(text);
        Paint.FontMetricsInt fontMetricsInt = mPaint.getFontMetricsInt();
        int baseline = (getMeasuredHeight() - fontMetricsInt.bottom + fontMetricsInt.top) / 2 - fontMetricsInt.top;
        canvas.drawText(text, (getWidth() - textWidth) / 2, baseline, mPaint);
    }

    public void setRadius(int radius) {
        this.radius = radius;
    }

    @Override
    public void setBackgroundColor(@ColorInt int backgroundColor) {
        this.backgroundColor = backgroundColor;
    }

    public void setTextSize(int textSize) {
        this.textSize = textSize;
    }

    public void setTextColor(int textColor) {
        this.textColor = textColor;
    }
}

(2)Set custom indicator for BannerViewPager

    FigureIndicatorView indicatorView = new FigureIndicatorView(mContext);
    indicatorView.setRadius(getResources().getDimensionPixelOffset(R.dimen.dp_18));
    indicatorView.setTextSize(getResources().getDimensionPixelSize(R.dimen.sp_13));
    indicatorView.setBackgroundColor(Color.parseColor("#aa118EEA"));

    mViewPager.setAutoPlay(false).setCanLoop(true)
               .setIndicatorSlideMode(IndicatorSlideMode.NORMAL)
               .setIndicatorVisibility(View.VISIBLE)
               .setIndicatorGravity(IndicatorGravity.END)
               .setIndicatorView(indicatorView).create(getPicList(4));

8. Proguard

you must add proguard rules，If you have called setScrollDuration method in your project:

    -keep class androidx.recyclerview.widget.**{*;}
    -keep class androidx.viewpager2.widget.**{*;}

TODO

[x] Optimization and Refactoring IndicatorView（2.0.1）
[x] Fix a bug which page frozen sometimes when sliding in version 2.1.0 （2.1.0.1）
[x] Set Transform Style Supported（2.1.2）
[x] Migrate to Androidx（2.2.0）
[x] indicator smooth slide Supported（2.2.2）
[x] Dash IndicatorView Supported（2.3.+）
[x] MULTI_PAGE Style Supported（2.4.0）
[x] Optimize code and improve performance in version 2.4.3
[x] Refactor Indicator again (2.5.0)
[x] Fix issue #34 which Indicator smooth slide problem(2.6.1).
[x] Migrate to ViewPager2 （3.0.0）

FAQ

If you have any question regard to BannerViewPager, please scan the QR code and join the QQ group to communicate.

Sponsor

开源不易随心赞赏

| Alipay | WeChat | |--|--| | | |

More details

《打造一个丝滑般自动轮播无限循环Android库》

《BannerViewPager源码解析》

《剖析BannerViewPager中Indicator的设计思想》

Thanks

玩Android

License

Copyright 2017-2020 zhpanvip

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

README.md

BannerViewPager

English | 中文

What's new in version 3.0

Preview

1.PageStyle

2.Indicator

(1)setIndicatorStyle and setIndicatorSlideMode

(2)Custom Indicator

API

Attributes

Useage

1.Gradle dependency

2.Add BannerViewPager in layout.xml

3.The item layout of banner:

4.Extends BaseViewHolder,and override methods.

5.Extends BaseBannerAdapter,and override methods

5.Use in Activity or Fragment:

6.startLoop and stopLoop

7.Custom IndicatorView

8. Proguard

TODO

FAQ

Sponsor

More details

Thanks

License