借助Handler，实现ViewPager中页面的自动切换-白红宇

借助Handler，实现ViewPager中页面的自动切换

阅读量：6455 次

发布时间：2019-06-23

本文共 6294 字，大约阅读时间需要 20 分钟。

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

下面是其中的两个截图：

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

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

public class ViewPagerAdapter extends PagerAdapter {		private List
    
      mData;		public ViewPagerAdapter(List
     
       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
    
      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
     
      ();		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
      
        mData;		public ViewPagerAdapter(List
       
         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非常简单，此处就省略了）

转载于:https://my.oschina.net/fengheju/blog/178404

你可能感兴趣的文章