ViewPager实现引导页

VewPager实现引导页

 ViewPager，是在Android3.0之后新增的API，可以用于导航栏，页面切换等控件，其主要功能是使视图可以左右滑动，也就是说可以实现轮播图和引导页等效果。

 下面我就开始正题了

xml中

 
    <android.support.v4.view.ViewPager
        android:id="@+id/vp_viewpager"
        android:layout_width="wrap_content"
        android:layout_height="477dp"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true">android.support.v4.view.ViewPager>
      
<LinearLayout
    android:id="@+id/ll"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_marginBottom="42dp"
    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true">LinearLayout>
  
    <Button
        android:id="@+id/into_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="开始"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:visibility="gone"/>

首先创建适配器，继承PagerAdapter。

public class MyViewPagerAdapter extends PagerAdapter {
    private ArrayList viewlist;

    public MyViewPagerAdapter(ArrayList viewlist) {
        this.viewlist = viewlist;
    }

    @Override
    public int getCount() {
        return viewlist.size();
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view==object;
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        container.addView(viewlist.get(position));
        return viewlist.get(position);
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView(viewlist.get(position));
    }
}


适配器写完了，就到activityle。

private ViewPager vp_viewpager;
//linlayout
private LinearLayout ll;
//点击跳转
private Button into_button;
//adapter 需要传递的参数
private ArrayList viewlist;
//集合
private int[] imgs={R.mipmap.aa,R.mipmap.bb,R.mipmap.cc,R.mipmap.dd};
private ArrayList arrayList;
private MyViewPagerAdapter pagerAdapter;

@Override
protected int getlayoutId() {
    return R.layout.activity_into_home;
}

@Override
protected void initView() {
     vp_viewpager= (ViewPager) findViewById(R.id.vp_viewpager);
    ll= (LinearLayout) findViewById(R.id.ll);
     into_button= (Button) findViewById(R.id.into_button);
    initData();
    initlistener();
}
private void initlistener() {
    vp_viewpager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
        //滚动页
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        }
        @Override
        public void onPageSelected(int position) {
            for (int i = 0; i < imgs.length; i++) {
                if (position==i){
                    //在这里注意  view没有下面这个方法
                    //只有ImgView才有这个方法
                    //R.drawable.shap  自定义颜色大小
                    arrayList.get(i).setImageResource(R.drawable.shap);
                }else{
                    arrayList.get(i).setImageResource(R.drawable.shap1);
                }
                if (position==imgs.length-1){
                    ll.setVisibility(View.GONE);
                    into_button.setVisibility(View.VISIBLE);
                }else{
                    ll.setVisibility(View.VISIBLE);
                    into_button.setVisibility(View.GONE);
                }
            }
        }

        @Override
        public void onPageScrollStateChanged(int state) {
        }
    });
    into_button.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
             startActivity(new Intent(YinDaoHome.this,MainActivity.class));
        }
    });
}

private void initData() {
    arrayList = new ArrayList<>();
    viewlist = new ArrayList<>();
    vp_viewpager.setCurrentItem(0);
    for (int i = 0; i < imgs.length; i++) {
        ImageView view=new ImageView(this);
        view.setImageResource(imgs[i]);
        viewlist.add(view);
    }
    for (int i = 0; i < imgs.length; i++) {
        ImageView imageView=new ImageView(this);
        imageView.setLayoutParams(new ViewGroup.LayoutParams(20,20));
        if (i==0){
            imageView.setBackgroundResource(R.drawable.shap);
        }else{
            imageView.setBackgroundResource(R.drawable.shap1);
        }
        arrayList.add(imageView);
        ll.addView(imageView);
    }
   pagerAdapter = new MyViewPagerAdapter(viewlist);
    vp_viewpager.setAdapter(pagerAdapter);
}

然后就是drawablex下的两个shap

shap.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <corners android:radius="10dp"/>
    <solid android:color="@android:color/darker_gray"/>
shape>

shap1.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <corners android:radius="10dp"/>
    <solid android:color="#fff000"/>
shape>

就这样ViewPager引导页就实现了。
我就在这献丑了，