当viewPager滑动到最后一页的时候继续向左划就会跳转到第一页,第一页向右划也会跳转到第一页。若viewPager共有6页,从第一页右划到第六页要想实现平滑过渡可不是viewPager.setCurrentItem(5);这么简单。这样跳转的过程中你会看到第二页到第五页的界面也会从你眼前掠过,而且第一页已经是首页,还要为它单独设置右划的监听事件。
效果如下
第一页向右划▼
最后一页左划▼ 最后一页滑动到第一页
停留在第二页▼
滑动到第二页若想实现上述的想法,需要在首页之前和尾页之后分别设置一个过渡页面,若viewPager中的可视界面一共有六页那么,加上两个过渡页后就是8页,按照 61234561的顺序排列。默认viewPager.setCurrentItem(1);第一页的前一页是最后一页,最后一页的后边就是第一页,第一页界面(position=1)往右划时可即滑动到最后一页对应的界面(position=0),然后在滑动的过程中跳转到实际显示最后一页的界面(position=6);
if(viewPager.getCurrentItem()==0) {//如果是第一页跳到倒数第二页
viewPager.setCurrentItem(viewPager.getAdapter().getCount()-2,false);
}
可以让指示器作为一个独立的工具类进行调用,使用时也比较方便:
vpIndicator=new VpIndicator(this);//设置指示器
vpIndicator.setViewPager(viewPager);//为指示器设置viewpager
vpIndicator.setVpSize(pageNum);//指示器小圆点的个数
llVp.addView(vpIndicator.getIndicator());//viewpager父布局中添加指示器布局
viewPager.setAdapter(adapter);
viewPager.setCurrentItem(1);
指示器具体代码如下
public class VpIndicator {
private ViewPager viewPager;//要设置指示器的viewPager
private Context context;
private int vpSize=0;//viewpager显示的页数 即指示器小点的个数
private List<ImageView> imageViewList;
public VpIndicator(Context context) {
this.context=context;
}
public void setViewPager(ViewPager viewPager) {
this.viewPager = viewPager;
}
public void setVpSize(int vpSize) {
this.vpSize = vpSize;
}
public View getIndicator(){
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams
(LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
lp.setMargins(10, 0, 10, 0);
viewPager.addOnPageChangeListener(new OnPagerChange());
View view= LayoutInflater.from(context).inflate(R.layout.vp_indicator,null);
LinearLayout llVp=(LinearLayout)view.findViewById(R.id.llIndicator);
imageViewList=new ArrayList<>();
ImageView imageView; //根据显示页面的数量,添加指示点
for(int i=0;i<vpSize;i++){
imageView=new ImageView(context);
imageView.setImageResource(R.mipmap.page_indicator_unfocused);
imageView.setLayoutParams(lp);
imageViewList.add(imageView);
llVp.addView(imageView);
}
imageViewList.get(0).setImageResource(R.mipmap.page_indicator_focused);
return view;
}
private class OnPagerChange implements ViewPager.OnPageChangeListener{
@Override
public void onPageScrolled(int position, float positionOffset,
int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
if(position==0){
imageViewList.get(vpSize-1).setImageResource(R.mipmap.page_indicator_focused);//最后一个点为黄点
imageViewList.get(vpSize-2).setImageResource(R.mipmap.page_indicator_unfocused);//倒数第二点为白点
imageViewList.get(0).setImageResource(R.mipmap.page_indicator_unfocused);
}else if(position==1){
imageViewList.get(0).setImageResource(R.mipmap.page_indicator_focused);
imageViewList.get(vpSize-1).setImageResource(R.mipmap.page_indicator_unfocused);
imageViewList.get(1).setImageResource(R.mipmap.page_indicator_unfocused);
}else if(position==vpSize){
imageViewList.get(position-1).setImageResource(R.mipmap.page_indicator_focused);
imageViewList.get(position-2).setImageResource(R.mipmap.page_indicator_unfocused);
imageViewList.get(0).setImageResource(R.mipmap.page_indicator_unfocused);
}else if(position==vpSize+1){
imageViewList.get(0).setImageResource(R.mipmap.page_indicator_focused);
imageViewList.get(vpSize-1).setImageResource(R.mipmap.page_indicator_unfocused);
imageViewList.get(1).setImageResource(R.mipmap.page_indicator_unfocused);
}else {
imageViewList.get(position-1).setImageResource(R.mipmap.page_indicator_focused);
imageViewList.get(position-2).setImageResource(R.mipmap.page_indicator_unfocused);
imageViewList.get(position).setImageResource(R.mipmap.page_indicator_unfocused);
}
}
@Override
public void onPageScrollStateChanged(int state) {
if (state == ViewPager.SCROLL_STATE_IDLE) {
if (viewPager.getCurrentItem() == viewPager.getAdapter()
.getCount() - 1) {//如果是最后一页跳到第二页
viewPager.setCurrentItem(1, false);//直接跳转,无动画
}else if (viewPager.getCurrentItem()== 0) {//如果是第一页跳到倒数第二页
viewPager.setCurrentItem(viewPager.getAdapter().getCount() - 2, false);
}
}
}
}
}
R.layout.vp_indicator
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="@+id/llIndicator"
android:layout_width="match_parent"
android:layout_height="20dp"
android:orientation="horizontal"
android:gravity="center"
android:layout_marginBottom="10dp">
</LinearLayout>
</LinearLayout>