Android App中用Handler实现ViewPager页面的自动切换

在很多电商网页及app上都有自动切换的商品的推广快，感觉体验挺不错的，正好今天学习使用viewpager，因此也实现了一个功能类似的demo。

下面是其中的两个截图：

实现一个自动播放功能的viewpager，要做的主要有以下的几个部分：

实现一个viewpageradapter，用于为viewpager提供展示内容（例如上面的两张小猫图片）

 public class viewpageradapter extends pageradapter {
    private list<view> mdata;
    public viewpageradapter(list<view> mdata) {
      this.mdata = mdata;
    }

    @override
    public int getcount() {
      return mdata.size();
    }

    @override
    public boolean isviewfromobject(view arg0, object arg1) {
      return arg0 == arg1;
    }
    
    @override
    public object instantiateitem(viewgroup container, int position) {
      view v = mdata.get(position);
      container.addview(v);
      return v;
    }
    
    @override
    public void destroyitem(viewgroup container, int position, object object) {
//  super.destroyitem(container, position, object);
      container.removeview(mdata.get(position));
    }
    
  }

实现一个onpagechangelistener，这样在页面切换后可以提示当前页面所在的位置（例如上图中，左下角的3个圆点，红色表示当前页面）

 private class viewpagechangelistener implements onpagechangelistener {

    @override
    public void onpagescrollstatechanged(int arg0) {
    }

    @override
    public void onpagescrolled(int arg0, float arg1, int arg2) {
    }

    //监听页面改变事件来改变viewindicator中的指示图片
    @override
    public void onpageselected(int arg0) {
      int len = viewindicator.getchildcount();
      for(int i = 0; i < len; ++i)
        viewindicator.getchildat(i).setbackgroundresource(r.drawable.tip_normal);
      viewindicator.getchildat(arg0).setbackgroundresource(r.drawable.tip_select);
    }
    
  }

实现一个handler，用于在一定的时间间隔后修改ui（将当前显示的图片切换到下一个）

private handler mhandler = new handler() {
    public void handlemessage(android.os.message msg) {
      switch(msg.what) {
      case 1:
        int totalcount = pagers.size();//autochangeviewpager.getchildcount();
        int currentitem = autochangeviewpager.getcurrentitem();
        
        int toitem = currentitem + 1 == totalcount ? 0 : currentitem + 1;
        
        log.i(tag, "totalcount: " + totalcount + "  currentitem: " + currentitem + "  toitem: " + toitem);
        
        autochangeviewpager.setcurrentitem(toitem, true);
        
        //每两秒钟发送一个message，用于切换viewpager中的图片
        this.sendemptymessagedelayed(1, 2000);
      }
    }
  };

上面这3段就是主要的代码，除此之外，还需要在onresume()中发送一个起始message以及在onstop()中停止viewpager页面的自动切换等内容。
完整的代码如下：

public class mainactivity extends activity {
  private static final string tag = mainactivity.class.getsimplename();
  private viewpager autochangeviewpager;
  
  //用来指示当前显示图片所在位置
  private linearlayout viewindicator;
  
  //包含要在viewpager中显示的图片
  private list<view> pagers;
  @override
  protected void oncreate(bundle savedinstancestate) {
    super.oncreate(savedinstancestate);
    setcontentview(r.layout.activity_main);
    
    autochangeviewpager = (viewpager) findviewbyid(r.id.autovp);
    viewindicator = (linearlayout) findviewbyid(r.id.vpindicator);
    
    initadapter();
    
    //监听页面改变事件来改变viewindicator中的指示图片
    autochangeviewpager.setonpagechangelistener(new viewpagechangelistener());
    
  }
  
  private void initadapter() {
    //即将在viewpager中展示的图片资源
    int[] imgs = {r.drawable.i1, r.drawable.i2, r.drawable.i3};
    
    //init pagers;
    pagers = new arraylist<view>();
    linearlayout.layoutparams img_params = new layoutparams(
        layoutparams.match_parent, layoutparams.match_parent
        );
    for(int i = 0; i < imgs.length; ++i) {
      imageview iv = new imageview(this);
      iv.setbackgroundresource(imgs[i]);
      iv.setlayoutparams(img_params);
      final int index = i;
      iv.setonclicklistener(new onclicklistener() {
        //当viewpager中的图片被点击后，跳转到新的activity
        @override
        public void onclick(view v) {
          intent i = new intent(mainactivity.this, invokedactivity.class);
          i.putextra("name", "cat " + index);
          mainactivity.this.startactivity(i);
        }
      });
      pagers.add(iv);
    }
    autochangeviewpager.setadapter(new viewpageradapter(pagers));
    
    //init indicator
    linearlayout.layoutparams ind_params = new layoutparams(
        layoutparams.wrap_content, layoutparams.wrap_content
        );
    for(int i = 0; i < imgs.length; ++i) {
      imageview iv = new imageview(this);
      if(i == 0)
        iv.setbackgroundresource(r.drawable.tip_select);
      else
        iv.setbackgroundresource(r.drawable.tip_normal);
      iv.setlayoutparams(ind_params);
      viewindicator.addview(iv);
    }
  }
  
  @override
  protected void onresume() {
    super.onresume();
    //activity启动两秒钟后，发送一个message，用来将viewpager中的图片切换到下一个
    mhandler.sendemptymessagedelayed(1, 2000);
  }
  
  @override
  protected void onstop() {
    super.onstop();
    //停止viewpager中图片的自动切换
    mhandler.removemessages(1);
  }

  public class viewpageradapter extends pageradapter {
    private list<view> mdata;
    public viewpageradapter(list<view> mdata) {
      this.mdata = mdata;
    }

    @override
    public int getcount() {
      return mdata.size();
    }

    @override
    public boolean isviewfromobject(view arg0, object arg1) {
      return arg0 == arg1;
    }
    
    @override
    public object instantiateitem(viewgroup container, int position) {
      view v = mdata.get(position);
      container.addview(v);
      return v;
    }
    
    @override
    public void destroyitem(viewgroup container, int position, object object) {
//  super.destroyitem(container, position, object);
      container.removeview(mdata.get(position));
    }
    
  }
  
  private class viewpagechangelistener implements onpagechangelistener {

    @override
    public void onpagescrollstatechanged(int arg0) {
    }

    @override
    public void onpagescrolled(int arg0, float arg1, int arg2) {
    }

    //监听页面改变事件来改变viewindicator中的指示图片
    @override
    public void onpageselected(int arg0) {
      int len = viewindicator.getchildcount();
      for(int i = 0; i < len; ++i)
        viewindicator.getchildat(i).setbackgroundresource(r.drawable.tip_normal);
      viewindicator.getchildat(arg0).setbackgroundresource(r.drawable.tip_select);
    }
    
  }
  
  private handler mhandler = new handler() {
    public void handlemessage(android.os.message msg) {
      switch(msg.what) {
      case 1:
        int totalcount = pagers.size();//autochangeviewpager.getchildcount();
        int currentitem = autochangeviewpager.getcurrentitem();
        
        int toitem = currentitem + 1 == totalcount ? 0 : currentitem + 1;
        
        log.i(tag, "totalcount: " + totalcount + "  currentitem: " + currentitem + "  toitem: " + toitem);
        
        autochangeviewpager.setcurrentitem(toitem, true);
        
        //每两秒钟发送一个message，用于切换viewpager中的图片
        this.sendemptymessagedelayed(1, 2000);
      }
    }
  };
}

布局文件如下：（上面代码中的invokedactivity非常简单，此处就省略了）

<framelayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent" >

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

  <linearlayout
    android:id="@+id/vpindicator"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:orientation="horizontal" />

</framelayout>