这是一款我刚写的开源库,起初写这个是因为我想要一个可以高度自定义化的轮播器,它包括了一下几个特点:
使用自己项目中的ImageLoader,而不是被迫使用库中的图片加载器;
库中内置几款常用的指示器,也可以创建自己想要的指示器;
丰富多彩的转场动画,亦可以发挥你的创意创造新的特效;
可以为每一页建立动画效果。
关于无限轮播
一般的ViewPager播放到最后一个位置时,若要返回到第一个位置则必须从右向左,作为Banner时这是不自然的过渡效果。
我们知道ViewPager显示的个数是由PagerAdaper的getCount()
方法决定的,既然如此那我们可以给它赋予一个极大的值使ViewPager不断向右轮播,这也是整个无限轮播的核心思想。
1 | public class InfinitePagerAdapter extends PagerAdapter { |
可以看到在代码中还存在着 BaseSliderAdapter
另一个 PagerAdapter ,这是一个正常的PagerAdapter,它既是数据的真正载体同时也起着维护viewpager真正个数的作用。
但用这个方法实现的无限轮播存在着一个很大的缺陷,在 page 页少于3个的情况下会出现问题,这是由于ViewPager本身的机制导致的。
简单来说,ViewPager在显示的时候会同时存在3个page页,当前显示页,当前显示的前一页,当前显示的后一页。当我们轮播到下一页时,原来的前一页会被回收,原来的当前页变成前一页,原来的后一页变成当前页,同时会加载出新的一页作为后一页。
而在无限轮播小于等于3页时,由于前一页可能没有被回收就被当做新的一页加载到后一页中,这就导致了view重复被ViewGroup添加,而在Android中View只能被允许拥有一个ParentView,这里就出现了问题。
所以在page页少于等于3页的时候还是要使用基础的 PagerAdapter。
关于指示器
指示器可以通过继承 ViewPager.OnPageChangeListener
与ViewPager保持联动,其监听器包括以下方法:1
2
3
4
5
6
7
8
9
10
11
12
13
14
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
// 滑动时的参数变化
}
public void onPageSelected(int position) {
// 滑动到第几页
}
public void onPageScrollStateChanged(int state) {
// 滑动时的状态变化
}
剩下的就是看你怎么定义指示器的界面,附上指示器演示图和一个自定义的指示器代码
关于转场动画
ViewPager有个方法叫做setPageTransformer(boolean reverseDrawingOrder, PageTransformer transformer)
用于设置ViewPager切换时的动画效果
但注意这只能在3.0及其以后使用。因为View的动画使用的是属性动画,而属性动画是3.0才推出。当然这个问题可以克服,首先先使用nineoldandroids
让动画在3.0之前也能跑起来,然后再去修改ViewPager的源码1
2
3
4
5
6
7
8
9
10
11
12
13
14 public void setPageTransformer(boolean reverseDrawingOrder, PageTransformer transformer) {
if (Build.VERSION.SDK_INT >= 11) {
final boolean hasTransformer = transformer != null;
final boolean needsPopulate = hasTransformer != (mPageTransformer != null);
mPageTransformer = transformer;
setChildrenDrawingOrderEnabledCompat(hasTransformer);
if (hasTransformer) {
mDrawingOrder = reverseDrawingOrder ? DRAW_ORDER_REVERSE : DRAW_ORDER_FORWARD;
} else {
mDrawingOrder = DRAW_ORDER_DEFAULT;
}
if (needsPopulate) populate();
}
}
去除if (Build.VERSION.SDK_INT >= 11)
这个if判断就行了。
所有的PageTransformer都要继承ViewPager.PageTransformer
接口,其中包含的方法只有一个1
2
3
4
public void transformPage(View view, float position) {
}
其中position反映的是view的位置变化。
假设现在ViewPager在A页现在滑出B页,则:
A页的position变化就是( 0, -1]
B页的position变化就是[ 1 , 0 ]
根据这个position就可以做出多样的转场变化了。
关于pager动画
同样要利用 ViewPager.OnPageChangeListener
监听ViewPager的变化以实现每个界面的变化。
Animation接口1
2
3
4
5
6
7
8
9public interface OnAnimationListener {
void onNextAnimationStart(BaseSliderView slider);
void onNextAnimationEnd(BaseSliderView slider);
void onPreAnimationStart(BaseSliderView slider);
void onPreAnimationEnd(BaseSliderView slider);
}
监听变化1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101/**
* A {@link ViewPager} that allows define custom animation
*/
public class AnimationViewPager extends ViewPager {
private int position = 0, prePositon = 0;
private OnAnimationListener animationListener;
private BaseSliderView slider, preSlider;
private boolean animating = false;
public AnimationViewPager(Context context) {
super(context);
initViewPager();
}
public AnimationViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
initViewPager();
}
private void initViewPager() {
addOnPageChangeListener(new OnPageChangeListener() {
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
if (position == 0 && positionOffset == 0) {
animateSliderEnd(position);
if (slider != null)
animationListener.onNextAnimationEnd(slider);
}
}
public void onPageSelected(int position) {
prePositon = AnimationViewPager.this.position;
AnimationViewPager.this.position = position;
if (prePositon > position)
animateSliderStart(position, position + 1);
if (prePositon < position)
animateSliderStart(position, position - 1);
}
public void onPageScrollStateChanged(int state) {
if (state == SCROLL_STATE_IDLE) {
animateSliderEnd(position);
}
}
});
}
private void animateSliderStart(int position, int prePositon) {
if (animationListener == null) return;
BaseSliderView slider = null, preSlider = null;
if (getAdapter() instanceof InfinitePagerAdapter) {
InfinitePagerAdapter pagerAdapter = (InfinitePagerAdapter) getAdapter();
slider = pagerAdapter.getSliderView(position);
preSlider = pagerAdapter.getSliderView(prePositon);
} else if (getAdapter() instanceof BaseSliderAdapter) {
BaseSliderAdapter sliderAdapter = (BaseSliderAdapter) getAdapter();
slider = sliderAdapter.getSliderView(position);
preSlider = sliderAdapter.getSliderView(prePositon);
}
if (slider != null)
animationListener.onNextAnimationStart(slider);
if (preSlider != null)
animationListener.onPreAnimationStart(preSlider);
}
private void animateSliderEnd(int position) {
if (animationListener == null) return;
if (getAdapter() instanceof InfinitePagerAdapter) {
InfinitePagerAdapter pagerAdapter = (InfinitePagerAdapter) getAdapter();
if (slider == null) slider = pagerAdapter.getSliderView(position);
else if (slider != pagerAdapter.getSliderView(position)) {
preSlider = slider;
slider = pagerAdapter.getSliderView(position);
}
} else if (getAdapter() instanceof BaseSliderAdapter) {
BaseSliderAdapter sliderAdapter = (BaseSliderAdapter) getAdapter();
if (slider == null) slider = sliderAdapter.getSliderView(position);
else if (slider != sliderAdapter.getSliderView(position)) {
preSlider = slider;
slider = sliderAdapter.getSliderView(position);
}
}
if (slider != null)
animationListener.onNextAnimationEnd(slider);
if (preSlider != null)
animationListener.onPreAnimationEnd(preSlider);
animating = false;
}
public OnAnimationListener getAnimationListener() {
return animationListener;
}
public void setAnimationListener(OnAnimationListener animationListener) {
this.animationListener = animationListener;
}
}
继承OnAnimationListener接口实现后的例子1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45public class DefaultDescriptionAnimation implements OnAnimationListener {
private final long DURATION = 300;
public void onNextAnimationStart(BaseSliderView slider) {
Log.d("simpleSlider", "onNextAnimationStart:" + slider.getPageTitle());
}
public void onNextAnimationEnd(BaseSliderView slider) {
Log.d("simpleSlider", "onNextAnimationEnd:" + slider.getPageTitle());
DescriptionSliderView sliderView = (DescriptionSliderView) slider;
if (sliderView.getTitleLayout().getVisibility() != View.VISIBLE)
translateShowAnimate(sliderView.getTitleLayout());
}
public void onPreAnimationStart(BaseSliderView slider) {
Log.d("simpleSlider", "onPreAnimationStart:" + slider.getPageTitle());
}
public void onPreAnimationEnd(BaseSliderView slider) {
Log.d("simpleSlider", "onPreAnimationEnd:" + slider.getPageTitle());
DescriptionSliderView sliderView = (DescriptionSliderView) slider;
alphaHideAnimate(sliderView.getTitleLayout());
}
public void alphaHideAnimate(View v) {
v.clearAnimation();
v.setVisibility(View.INVISIBLE);
AlphaAnimation aa = new AlphaAnimation(1, 0);
aa.setDuration(DURATION);
v.startAnimation(aa);
}
public void translateShowAnimate(View v) {
v.setVisibility(View.VISIBLE);
v.clearAnimation();
TranslateAnimation ta = new TranslateAnimation(0, 0, v.getHeight(), 0);
ta.setDuration(DURATION);
v.startAnimation(ta);
}
}