Android开发——Viewpager的介绍使用

目录：

一、Viewpager的简单介绍

二、简单的Viewpager使用

三、简单显示图片的Viewpager实现

四、广告图的实现及Viewpager指示器（小圆点）的实现

五、APP引导页的实现

一、ViewPager介绍

官方文档解释：

Layout manager that allows the user to flip left and right through pages of data. You supply an implementation of a PagerAdapter to generate the pages that the view shows.
ViewPager is most often used in conjunction with android.app.Fragment, which is a convenient way to supply and manage the lifecycle of each page. There are standard adapters implemented for using fragments with the ViewPager, which cover the most common use cases. These are android.support.v4.app.FragmentPagerAdapter and android.support.v4.app.FragmentStatePagerAdapter; each of these classes have simple code showing how to build a full user interface with them.
Views which are annotated with the ViewPager.DecorView annotation are treated as part of the view pagers 'decor'. Each decor view's position can be controlled via its android:layout_gravity attribute. For example:
   <android.support.v4.view.ViewPager
       android:layout_width="match_parent"
       android:layout_height="match_parent">
 
       <android.support.v4.view.PagerTitleStrip
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:layout_gravity="top" />
 
   </android.support.v4.view.ViewPager>
   
For more information about how to use ViewPager, read Creating Swipe Views with Tabs.
You can find examples of using ViewPager in the API 4+ Support Demos and API 13+ Support Demos sample code.

大概的意思为：

  • 布局管理器允许左右翻转带数据的页面，你想要显示的视图可以通过实现PagerAdapter来显示。这个类其实是在早期设计和开发的，它的API在后面的更新之中可能会被改变，当它们在新版本之中编译的时候可能还会改变源码。

  • ViewPager经常用来连接Fragment，它很方便管理每个页面的生命周期，使用ViewPager管理Fragment是标准的适配器实现。最常用的实现一般有FragmentPagerAdapter和FragmentStatePagerAdapter。

  • FragmentPagerAdapter和FragmentStatePagerAdapter是ViewPager和Fragment一起使用时才会用到，后面会详细介绍，这里就不介绍了

二、简单的ViewPager使用

使用方法其实与Listview和RecyclerView的方法类似

1.布局文件使用Viewpager

2.定义一个适配器类使其继承PagerAdapter，复写其中的四个方法，分别是getCount，isViewFromObject，instantiateItem和destroyItem

　　@Override
    public int getCount() {
        return 3;//在Viewpager显示3个页面
    }

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

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        TextView tv = new TextView(container.getContext());
        tv.setGravity(Gravity.CENTER);
        tv.setTextSize(20);
        tv.setText("第" + position + "页");

        // 添加到ViewPager容器
        container.addView(tv);

        // 返回填充的View对象
        return tv;


    }

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

 

3.findviewbyid方法找到viewpager

4.设置适配器

效果图：

 

三、简单显示图片的Viewpager实现

1.布局中使用viewpager

 

2.定义一个适配器类使其继承PagerAdapter，复写其中的四个方法，分别是getCount，isViewFromObject，instantiateItem和destroyItem

 private int [] mImage;

    public AdvertiseViewpagerAdapter(int[] mImage) {
        this.mImage = mImage;//接收传入的mIamge
    }

    @Override
    public int getCount() {
        return 3;//在Viewpager显示3个页面
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view==object;
    }
    //设置每一页显示的内容
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        ImageView imageView = new ImageView(container.getContext());
        imageView.setImageResource(mImage[position]);//ImageView设置图片
        container.addView(imageView); // 添加到ViewPager容器
        return imageView;// 返回填充的View对象
    }
    // 销毁条目对象
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView((View) object);
    }

 

这里注意看红色的代码，我们在适配类中定义了一个成员变量，用来接收参数传入的图片资源id，之后在instantiateItem方法中，new一个ImageView，将其的图片设置为数组中存放的图片资源id，其他的代码与之前一样，这里就不多解释了

3.在activity文件中声明一个整型数组，将图片资源id存放进去

4.new一个适配器，将整型数组传入

5.findviewbyid找到viewpager，为其设置适配器

 

效果图：

四、广告图的实现及Viewpager指示器（小圆点）的实现

 本来开始写的时候，我还是用的别人的库来实现小圆点功能，之后，研究了一下，发现实现其实很简单，想要了解的同学可以看我这一篇Android开发——打造简单的Viewpager指示器（小圆点指示器）

今天写的就是拿别人的来使用

项目名称CircleIndicator，github

第一步，添加依赖

 

第二步，在xml中使用

 

第三步，为circleIndicator绑定viewpager

 

 

 效果图：

　　　　颜色有些白，可能看得不太清楚。。

 

 

PS：可以通过自定义属性修改颜色，不过，修改颜色就变成了正方形了，不太懂是怎么回事

 

 五、APP引导页的实现

首先，我们理解一下引导页的逻辑

这里有个问题，如何才能判断是否是第一次进入APP呢？其实很简单，使用 SharedPreferences，这里我不多说了

我这一篇有用到SharedPreferences，可以参考参考Android开发模板代码（二）——为ImageView设置图片，退出后能保存ImageView的状态

 

1.在xml中使用viewpager

这里我们还可以加上一个圆形指示器，这样比较好看，市场上的大部分APP都是有个圆形指示器的嘛，我们也随主流

这里我们可以使用之前的那个开源库CircleIndicator，如果你是想实现移动的小圆点指示器，打一波广告，推荐使用开源库CIrclePointMove

这个开源库是我用两天写出来的，简单设置之后就能实现小圆点移动的功能

提示：

使用RelativeLayout，可以使得小圆点指示器显示在Viewpager上方

layout_above 该控件显示在fragmentViewpager的上方

layout_alignParentBottom 该控件是否贴近父布局的底部

 

2.定义个适配类，这里我们使用viewpager装载fragment

我这里用了两个Fragment，一个fragment显示第一页，来一个显示第二页

代码与之前类似，相信大家也是看到明白，不过，这里提一下，ViewPager的FragmentAdapter有两种，一种是FragmentPagerAdapter，另外一种则是FragmentPageStateAdapter,这两种的区别在于，前者在换到其他页时不会销毁之前的页面内容，适合页面较少的情况使用，后者则是换到其他页会将之前的页面给销毁，返回到之前的页面就是重新加载，适合页面过多的情况使用

3.为Viewpager设置adapter

4.使用CirclePointMove实现小圆点跟随viewpager移动

 

 5.效果图

 

 PS：我这里只是简单地演示了Fragment，你也可以使用我上面的提示，在下面加个按钮实现下一页，需要使用到Viewpager的setCurrentItem方法，参数为position，还有跳过功能，直接显示出主界面

 Demo

 

posted @ 2018-02-09 17:22  Stars-one  阅读(23924)  评论(0)  编辑  收藏  举报