Android viewPager Guidelines

viewPager is an official Google easy to achieve page sliding effect of the control, can be used directly or with fragment joint use. I'm just going to talk a little bit about using it directly.
The steps for using viewPager are as follows:

(1) Place viewPager controls in the layout
(2) Set view loaded into viewPager
(3) Write adapter specific to viewPager
(4) Instantiate viewPager and bind it to adapter set in the previous step

Reflect the MVC thoughts this step, you can refer to my previous article https: / / www ofstack. com article / 78174. htm

For the sake of illustration, I created a new project to illustrate the use of viewPager

Step 1 Create a new viewPager in the layout

The layout file is as follows:

<android.support.v4.view.ViewPager
    android:id="@+id/view_pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
</android.support.v4.view.ViewPager>

Set view loaded into viewPager

For convenience, display view with 2 different background colors and put them into viewPager. The layout of each view is as follows:
item_one

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
  android:background="@android:color/holo_red_light">
</LinearLayout>

item_two

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
  android:background="@android:color/holo_blue_bright">
</LinearLayout>

Write adpter specific to viewPager

Here we inherit PagerAdapter of viewPager, and mainly rewrite getCount methods, destroyItem, instantiateItem, isViewFromObject, and so on. The code is as follows:

public class Adapter extends PagerAdapter{

    private List<View> views;

    public Adapter(List<View> views){
      this.views = views;
    }
    @Override
    public int getCount() {
      return views.size();
    }

    @Override
    public void destroyItem(View arg0, int arg1, Object arg2) {
      ((ViewPager) arg0).removeView(views.get(arg1));
    }

    @Override
    public void finishUpdate(View arg0) {
    }
    @Override
    public Object instantiateItem(View arg0, int arg1) {
      ((ViewPager) arg0).addView(views.get(arg1), 0);
      return views.get(arg1);
    }
    @Override
    public boolean isViewFromObject(View arg0, Object arg1) {
      return arg0 == (arg1);
//      return false;
    }
    @Override
    public void restoreState(Parcelable arg0, ClassLoader arg1) {
    }
    @Override
    public Parcelable saveState() {
      return null;
    }
    @Override
    public void startUpdate(View arg0) {
    }
  }

Instantiate viewPager and bind Adapter

Here, viewPager is instantiated as mpager, and the constructed view:item_one and item_two are loaded into the constructed View array via LayoutInflater. Add the array to List < View > The inside. Passed in as a parameter to adapter. The code is as follows:

private ViewPager mpager;
  private List<View> myview = new ArrayList<>();
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    mpager = (ViewPager) findViewById(R.id.view_pager);
    LayoutInflater mInflater = getLayoutInflater();
    View [] pagers = {mInflater.inflate(R.layout.item_one ,null),
              mInflater.inflate(R.layout.item_two , null)};

    for(int i = 0; i < pagers.length ; i++) {
      myview.add(pagers[i]);
    }
    Adapter ad = new Adapter(myview);
    mpager.setAdapter(ad);
    mpager.setCurrentItem(0);
  }

PS: Implement the viewPager manual infinite loop

Here is a way to set the page jump to achieve infinite loop. Add two view to the myviews array, adding the last itemview at position 0 and the last itemview at position 1, respectively. The code is as follows:

final View [] pagers = {mInflater.inflate(R.layout.item_one ,null),
              mInflater.inflate(R.layout.item_two , null),
              mInflater.inflate(R.layout.item_three,null)};

    for(int i = 0; i < pagers.length ; i++) {
      myview.add(pagers[i]);
    }
    myview.add(0,mInflater.inflate(R.layout.item_three , null));
    myview.add(4, mInflater.inflate(R.layout.item_one, null));

Here, for the convenience of testing, 1 item is added on the basis of the above, namely 3 view loops
Used to achieve cohesion. When you slide to the last page, specify the page as the page of the first view, and when you slide to the left, specify the page as the page of the last view. Note that the last one of view is not the last one of the index group but the last one of the three view.

Setting setOnPageChangeListener's instantiation object is not recommended, but we'll stick with it for the sake of doing it. When Google updates viewPager in the future, it can automatically realize the loop with attributes.
The code is as follows:

 mpager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
      @Override
      public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

      }

      @Override
      public void onPageSelected(int position) {
        int index = position;
        if(index == 0){
        // Note that there pagers Array, not myviews An array of 
          index = pagers.length;
        }else if(position == pagers.length + 1){
          index = 1;
        }
        if(position != index){
          mpager.setCurrentItem(index, false);
        }
      }

      @Override
      public void onPageScrollStateChanged(int state) {

      }
    });

Override the instantiateItem method in Adapter to display view

public Object instantiateItem(View arg0, int arg1) {
      if(arg1 == 0){
        ((ViewPager) arg0).removeView(views.get(myview.size() - 3));
        ((ViewPager) arg0).addView(views.get(myview.size() - 3), 0);
      }else if(arg1 == myview.size() - 1){
        ((ViewPager) arg0).removeView(views.get(0));
        ((ViewPager) arg0).addView(views.get(0), 0);

      }else{
        ((ViewPager) arg0).addView(views.get(arg1), 0);
      }
      return views.get(arg1);
    }

In this way, unlimited sliding can be easily implemented, but bug with blank page appears when sliding, probably because of the reason that removeView was added before view.