ViewPager图片的自动切换(滑动)

22 篇文章 1 订阅

效果展示:实现图片、文字、圆点的同时滑动

 一、使用自定义控件

        在安卓的libs目录下含有一个jar包:android-support-v4.jar,其中就含有这个自定义的控件ViewPager

在布局文件中使用此控件:

1、使用帧布局将ViewPager控件包裹起来

2、在ViewPager上面加入LinearLayout【其中含有文字和圆点】

3、使用LinearLayout将五个圆点包含进来

4、设置小圆点的状态选择器:使用shape

        普通的小圆点

        显示时小圆点

二、在Activity中实现效果

1、填充数据:

        分别创建图片、文字和圆点的集合和数组

 2、初始化获取控件

①设置标题

②给ViewPager设置适配器【继承于PagerAdapter】:在适配器中添加数据和删除数据

        添加数据:viewPager.addView(..)

        删除数据:viewPage.removeView(…)

 

 ③设置ViewPager改变时的监听器,实现圆点、文字随着图片同时改变的效果

其中的三种状态:

        onPageScrollStateChanged:代表是否处于滑动(被改变)的状态

        onPageScrolled:页面滑动的时候的状态

        onPageSelected:页面被改变的时候的状态

在onPageSelectd中进行处理文字和圆点的更新:

        文字:更新题目,即显示的文字

        圆点:

                定义全局的变量:记录上一页的圆点的位置

                更新圆点的显示:设置当前最新的圆点的状态为显示状态[设置图片为状态选择器中显示时的样式]

                设置更新前的圆点的状态为普通状态

                将最新的圆点的状态赋给更新前的圆点

3、设置自动改变页面

Tips:

        当页面可以显示的时候执行的是onStart方法

        当不显示的时候执行的是onStop方法

        Timer这个定时器,是基于系统时间的时候,是比较敏感的,当系统时间改变了,会发生变化

        所以,使用Executors创建一个单线程池的计时器

1、通过Executors创建单线程池的计时器:

        通过这个计时器执行即使操作

        scheduledExecutor = Executors.newSingleThreadScheduledExecutor();

        

参数:

        ①执行的任务

        ②延时时间

        ③间隔时间

        ④执行的时间的单位

2、执行的任务:创建一个任务Task

        进行切换图片

        发送消息通知界面更新(发送空消息即可)

3、创建Handler,接收消息

        在handleMessage方法中,通过viewPager设置当前的条目,即指定当前的页面的显示

4、停止切换

        在onStop方法中停止切换图片,通过停掉计时器(shutdown方法)

Tips:如何实现无限循环播放:

        在获取每个页面的时候,通过potion%images.size()的形式,在到达最后一个页面的时候,自动回到第一个界面,进行重新播放

      需要注意的是,需要将适配器中的getCount方法的返回值设置为Integer的最大值(MAX_VALUE),即可实现无限循环的效果

public class MainActivity extends Activity {

	private List<ImageView> imageViews;
	private String[] titles;
	private List<View> dots;
	private ViewPager vp;
	private TextView tv_title;
	private MyPagerAdapter adapter;
	private int currentItem;
	private int oldPosition;
	private ScheduledExecutorService scheduledExecutor;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		initData();
		initView();
	}

	// 初始化数据,填充
	private void initData() {
		// 图片
		int[] imageIDs = { R.drawable.a, R.drawable.b, R.drawable.c,
				R.drawable.d, R.drawable.e };
		imageViews = new ArrayList<ImageView>();
		for (int i = 0; i < imageIDs.length; i++) {
			ImageView imageView = new ImageView(getApplicationContext());
			imageView.setImageResource(imageIDs[i]);
			imageViews.add(imageView);
		}
		// 文字
		titles = new String[] { "巩俐不低俗,我就不能低俗", "扑树又回来啦!再唱经典老歌引万人大合唱",
				"揭秘北京电影如何升级", "乐视网TV版大派送", "热血屌丝的反杀" };

		// 圆点
		dots = new ArrayList<View>();
		dots.add(findViewById(R.id.dot_0));
		dots.add(findViewById(R.id.dot_1));
		dots.add(findViewById(R.id.dot_2));
		dots.add(findViewById(R.id.dot_3));
		dots.add(findViewById(R.id.dot_4));
	}

	// 初始化控件
	private void initView() {
		// 找到viewpr控件
		vp = (ViewPager) findViewById(R.id.vp);
		
		// 找到文字文本框,并设置标题
		tv_title = (TextView) findViewById(R.id.tv_title);
		tv_title.setText(titles[0]);
		
		// 设置viewpager的适配器
		adapter = new MyPagerAdapter();
		vp.setAdapter(adapter);
		// 设置viewpager的页面改变的监听器
		vp.setOnPageChangeListener(new MyOnPageChangeListener());

	}

	// viewpager的页面改变的监听器
	private class MyOnPageChangeListener implements OnPageChangeListener {

		//当页面发生改变的时候,进行更新页面
		public void onPageSelected(int position) {
			currentItem = position;
			//文字
			tv_title.setText(titles[position%imageViews.size()]);
			
			//圆点
			dots.get(position%imageViews.size()).setBackgroundResource(R.drawable.dot_focused);
			dots.get(oldPosition%imageViews.size()).setBackgroundResource(R.drawable.dot_normal);
			
			oldPosition = position;

		}

		@Override
		public void onPageScrolled(int arg0, float arg1, int arg2) {

		}

		@Override
		public void onPageScrollStateChanged(int arg0) {
		}
	}

	// viewpager的适配器
	private class MyPagerAdapter extends PagerAdapter {

		@Override
		public int getCount() {
			//为了实现无限自动切换,设置最大值
			return Integer.MAX_VALUE;
		}

		//删除数据
		public void destroyItem(ViewGroup container, int position, Object object) {
			vp.removeView(imageViews.get(position%imageViews.size()));
		}

		//添加数据
		public Object instantiateItem(View container, int position) {
			vp.addView(imageViews.get(position%imageViews.size()));
			return imageViews.get(position%imageViews.size());
		}

		//TODO ?
		public boolean isViewFromObject(View arg0, Object arg1) {
			return arg0==arg1;
		}
	}

	//开始时,自动切换
	protected void onStart() {
		super.onStart();
		//创建单线程池计时器
		scheduledExecutor = Executors.newSingleThreadScheduledExecutor();
		scheduledExecutor.scheduleAtFixedRate(new MyPagerTask(), 2, 2, TimeUnit.SECONDS);
	}
	
	//停止时,停止切换
	protected void onStop() {
		super.onStop();
		scheduledExecutor.shutdown();
		scheduledExecutor = null;
	}
	
	private class MyPagerTask implements Runnable{

		public void run() {
			currentItem ++;
			handler.sendEmptyMessage(0);
		}
		
	}
	
	//接收消息,设置当前的界面
	private Handler handler = new Handler(){
		public void handleMessage(android.os.Message msg) {
			vp.setCurrentItem(currentItem);
		}
	};
	
}

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
要实现ViewPager的自动滑动和手动滑动加点击切换,可以按以下步骤进行操作: 1. 在layout文件中添加ViewPager控件: ``` <android.support.v4.view.ViewPager android:id="@+id/view_pager" android:layout_width="match_parent" android:layout_height="wrap_content"/> ``` 2. 在Activity或Fragment中初始化ViewPager并设置Adapter: ``` ViewPager viewPager = findViewById(R.id.view_pager); viewPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager())); ``` 3. 实现自动滑动功能,可以使用Handler和Runnable来实现: ``` private Handler handler = new Handler(); private Runnable runnable = new Runnable() { @Override public void run() { int currentItem = viewPager.getCurrentItem(); int count = viewPager.getAdapter().getCount(); if (currentItem < count - 1) { viewPager.setCurrentItem(currentItem + 1); } else { viewPager.setCurrentItem(0); } handler.postDelayed(runnable, 3000); } }; // 在onResume()方法中启动自动滑动 @Override protected void onResume() { super.onResume(); handler.postDelayed(runnable, 3000); } // 在onPause()方法中停止自动滑动 @Override protected void onPause() { super.onPause(); handler.removeCallbacks(runnable); } ``` 4. 实现手动滑动和点击切换功能,可以在ViewPager的OnPageChangeListener中处理: ``` viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {} @Override public void onPageSelected(int position) { // 处理页面切换事件 } @Override public void onPageScrollStateChanged(int state) { // 处理滑动状态变化事件 } }); ``` 在onPageSelected()方法中可以处理页面切换事件,比如更新页面指示器的状态。在onPageScrollStateChanged()方法中可以处理滑动状态变化事件,比如停止自动滑动或重新开始自动滑动。 以上就是实现ViewPager自动滑动和手动滑动加点击切换的基本步骤,具体实现可以根据需求进行调整。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

休以希

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值