既然敢说商业级,那么就支持足够的自定义与扩展性! 实现思路请看这 开发一款商业级Banner控件
效果图:
- 设置自定义指示器效果
- 设置指示器位置
- 设置是否循环
- 是否可以跳转
- 页面切换间隔
- 页面切换持续时间
- 是否支持手动滑动
- 是否反向切换页面(切换方向)
// root build.gradle
repositories {
jcenter()
maven { url "https://www.jitpack.io" }
}
// yout project build.gradle
dependencies {
compile 'com.github.LidongWen:WenldBanner:xxx'
}
```
<com.wenld.wenldbanner.WenldBanner
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/commonBanner"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:canLoop="true" //设置是否循环
app:canTurn="true" //是否可以跳转
app:autoTurnTime="5000"// 页面切换间隔
app:scrollDuration="2000"//页面切换持续时间
app:isTouchScroll="true" //是否支持手动滑动
app:reverse="true" // 是否反向切换页面(切换方向)
/>
```
wenldBanner = (WenldBanner) findViewById(R.id.commonBanner);
//初始化指示器
defaultPageIndicator = new DefaultPageIndicator(this);
//设置指示器样式 选中图标与未选中图标
defaultPageIndicator.setPageIndicator(new int[]{R.mipmap.ic_page_indicator, R.mipmap.ic_page_indicator_focused});
//设置 view 与 数据
wenldBanner.setPages(Common.holder, Common.datas);
wenldBanner
.setPageIndicatorListener(defaultPageIndicator) //设置指示器监听
.setIndicatorView(defaultPageIndicator) //设置指示器VIew
.setPageIndicatorAlign(RelativeLayout.ALIGN_PARENT_BOTTOM, RelativeLayout.CENTER_HORIZONTAL); //设置指示器位置
还可以设置任意指示器样式,指示器监听事件,指示器位置等等...
比如实现这个效果:
注意:
先将根目录设置 android:clipChildren="false"
,在设置AutiTurnViewPager的宽度 给 viewpPager留出一些空隙android:layout_width="250dp"
在代码中设置PageTransformer
查看转换效果
xml文件
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
...
android:clipChildren="false">
<com.wenld.wenldbanner.AutoTurnViewPager
android:id="@+id/autoTurnViewPager"
android:layout_width="250dp"
android:clipToPadding="false"
...
<com.wenld.wenldbanner.DefaultPageIndicator
...
</FrameLayout>
java 要设置PageTransformer
否则看不出效果
protected void onCreate(Bundle savedInstanceState) {
autoTurnViewPager.setPageTransformer(new ZoomOutPageTransformer());
}
· 修复点击事件无效bug
· 优化
· 更换无限循环方式,使操作更加流畅 · 优化代码,真实循环采用观察者模式