Sem descrição

3 Ramos

zhpanvip 6809c77c91 Update REDMINE.md		há 5 anos atrás
.github	ef9a4120b2 Update FUNDING.yml	há 5 anos atrás
app	6809c77c91 Update REDMINE.md	há 5 anos atrás
bannerview	6809c77c91 Update REDMINE.md	há 5 anos atrás
gradle	25bc0350b3 update gradle version to 5.4.1	há 5 anos atrás
ideahttp	454ee03539 New Api disableTouchScroll (#28)	há 5 anos atrás
image	6809c77c91 Update REDMINE.md	há 5 anos atrás
.gitignore	85df0692f4 optimize sliding conflict (#99)	há 5 anos atrás
LICENSE	63fc39d7a5 Create LICENSE	há 5 anos atrás
README.md	6809c77c91 Update REDMINE.md	há 5 anos atrás
README_CN.md	6809c77c91 Update REDMINE.md	há 5 anos atrás
build.gradle	20f01a2996 Migrate to ViewPager2	há 5 anos atrás
git	16134c571c 优化demo	há 5 anos atrás
gradle.properties	88c09a7271 Migrate to androidx	há 5 anos atrás
gradlew	7cd1aff3e4 add Annotation for IndicatorGravity	há 5 anos atrás
gradlew.bat	8fce1800a5 Initial commit	há 8 anos atrás
settings.gradle	9ba615c084 Fix a bug,that Banner can't display when get data from server.	há 5 anos atrás

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

- 基于ViewPager2实现
- 支持多类型Item
- 内存大幅优化，性能大幅提升
- 新增setOrientation，支持竖直滑动
- 新增addPageTransformer与removeTransformer
- setAdapter替换setHolderCreator
- registerOnPageChangeCallback替换setOnPageChangeListener
- setUserInputEnabled取代disableTouchScroll
- 移除setPageTransformerStyle
- 移除部分2.x版本已废弃的方法
- 不再支持android support.

1.PageStyle

Sample Click Here

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

2.Indicator

The IndicatorView 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

xml支持的attrs

Useage

由于ViewPager2不支持Android support，因此BannerViewPager 3.0不再支持Android support，如果你仍在使用Android support请使用，请移步BannerViewPager 2.x版本

1.Gradle dependency

在项目的root build.gradle中添加如下配置：

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

Then add the dependency in your app build.gradle

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:

    <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.

    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.BannerViewPager参数配置

    private BannerViewPager<CustomBean, NetViewHolder> mBannerViewPager;
    ...
	private void initViewPager() {
             mBannerViewPager = findViewById(R.id.banner_view);
             mBannerViewPager
                             .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)
                             .setScrollDuration(500)
                             .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.

但是为了节省性能建议在onPause中停止轮播，在onResume中开启轮播：

    @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().getDimensionPixelOffset(R.dimen.dp_13));
    indicatorView.setBackgroundColor(Color.parseColor("#aa118EEA"));

    mViewPager.setIndicatorGravity(IndicatorGravity.END)
              .setIndicatorView(indicatorView)
              .setHolderCreator(() -> new ImageResourceViewHolder(0))
              .create(mDrawableList);

8. Proguard config

If you called setScrollDuration in your project,you must add proguard config as following:

    -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 2019 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

1.PageStyle

2.Indicator

(1)setIndicatorStyle and setIndicatorSlideMode

(2)Custom Indicator

开放API

xml支持的attrs

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.BannerViewPager参数配置

6.startLoop and stopLoop

7.Custom IndicatorView

8. Proguard config

TODO

FAQ

Sponsor

More details

Thanks

License