viewpager实现自动循环轮播图

本文实例为大家分享了viewpager自动循环轮播图的具体代码,供大家参考,具体内容如下

布局文件

android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<RelativeLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content">
  <androidx.viewpager.widget.ViewPager
   android:id="@+id/vp_adv"
   android:layout_width="match_parent"
   android:layout_height="160dp"/>
<LinearLayout
   android:id="@+id/View_indicator"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:layout_below="@id/vp_adv"
   android:layout_marginTop="-25dp"
   android:orientation="horizontal"
   android:gravity="right">
  </LinearLayout>
 </RelativeLayout>
</LinearLayout>

核心代码

public class MainActivity extends AppCompatActivity {
 private ImageView indicator;//表示圆点指示器
 private ImageView [] indicators;//保存圆点指示器的数组
 private boolean iscontinue = true;
 private ViewPager viewPager;
 private ViewGroup viewGroup;
 private ArrayList<Fragment> fragments;
 List<Integer> imgs = null;
 private AtomicInteger index = new AtomicInteger();
 private Handler viewHandler= new Handler(){
  @Override
  public void handleMessage(@NonNull Message msg) {
   super.handleMessage(msg);
   viewPager.setCurrentItem(msg.what);
  }
 };

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  initView();
 }
 public void initView(){
  viewPager=findViewById(R.id.vp_adv);
  viewGroup=findViewById(R.id.View_indicator);
  //四张广告图片加载到集合中进行保存
  List<View> listPics = new ArrayList<>();
  ImageView img1 = new ImageView(this);
  img1.setBackgroundResource(R.mipmap.food1);
  listPics.add(img1);
  ImageView img2 = new ImageView(this);
  img1.setBackgroundResource(R.mipmap.shop2);
  listPics.add(img2);
  ImageView img3 = new ImageView(this);
  img1.setBackgroundResource(R.mipmap.shop3);
  listPics.add(img3);
  ImageView img4 = new ImageView(this);
  img1.setBackgroundResource(R.mipmap.shop4);
  listPics.add(img4);
  initFragments();
  //动态设置四个圆点属性
  indicators = new ImageView[listPics.size()];
  for(int i=0;i<indicators.length;i++){
   indicator = new ImageView(this);
   indicator.setLayoutParams(new LinearLayout.LayoutParams(40,40));
   indicator.setPadding(5,5,5,5);
   indicators[i] = indicator;
   if(i == 0){
    indicators[i].setBackgroundResource(R.drawable.ic_launcher_background);
   }else{
    indicators[i].setBackgroundResource(R.drawable.ic_launcher_foreground);
   }
   viewGroup.addView(indicators[i]);
  }
  //设置ViewPager适配器
  viewPager.setAdapter(new pagerAdapter(getSupportFragmentManager()));

  //设置viewPager监听器
  viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
   @Override
   public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

   }

   @Override
   public void onPageSelected(int position) {
    index.getAndSet(position);
    for(int i = 0;i <indicators.length; i ++){
     if(i ==position){
      indicators[i].setBackgroundResource(R.drawable.a1);
     }else{
      indicators[i].setBackgroundResource(R.drawable.a2);
     }
    }

   }

   @Override
   public void onPageScrollStateChanged(int state) {

   }
  });
  viewPager.setOnTouchListener(new View.OnTouchListener() {
   @Override
   public boolean onTouch(View view, MotionEvent motionEvent) {
    switch (motionEvent.getAction()){
     case MotionEvent.ACTION_DOWN:
      iscontinue = false;
      break;
     case MotionEvent.ACTION_UP:
      iscontinue = true;
      break;
    }
    return false;
   }
  });
  //使用多线程切换UI
  new Thread(new Runnable() {
   @Override
   public void run() {
    while (true){
     if(iscontinue){
      viewHandler.sendEmptyMessage(index.get());
      whatOption();
     }
    }

   }
  }).start();
 }
 private void whatOption(){
  index.incrementAndGet();//将当前位置+1;
  if(index.get()>indicators.length-1){
   index.getAndAdd(-4);
  }
  try {
   Thread.sleep(2000);
  } catch (InterruptedException e) {
   e.printStackTrace();
  }
 }
 private void initFragments() {
  imgs = new ArrayList<Integer>();
  imgs.add(R.mipmap.timg1);
  imgs.add(R.mipmap.timg2);
  imgs.add(R.mipmap.timg3);
  imgs.add(R.mipmap.timg4);

 }
 class pagerAdapter extends FragmentPagerAdapter{

  public pagerAdapter(FragmentManager fm) {
   super(fm);
  }

  @Override
  public Fragment getItem(int arg0) {
   //得到要显示的对象并初始化图片
   MyFragment fm = new MyFragment();
   fm.setUrl(imgs.get(arg0));

   return fm;
  }

  @Override
  public int getCount() {
   return imgs.size();
  }

 }
}

class MyPagerAdapter extends PagerAdapter{
 private List<View> viewList;
 public MyPagerAdapter(List<View>viewList){
  this.viewList = viewList;
 }

 @Override
 public int getCount() {
  return viewList.size();
 }

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

 @NonNull
 @Override
 public Object instantiateItem(@NonNull ViewGroup container, int position) {
  container.addView(viewList.get(position));
  return viewList.get(position);
 }

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

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android实现基于ViewPager的无限循环自动播放带指示器的轮播图CarouselFigureView控件

    最近用到需要无限轮播自动播放的轮播轮播图,网上感觉都有这样那样的问题,于是自己写了一个通用的控件CarouselFigureView. 特点: 1.可以轮播view可以自己定义,不一定是要是ImageView2.指示器默认显示,但是可以隐藏3.可以设置指示器的颜色.间距.大小 4.有基础的可以自己修改代码改变指示器位置,这个应该不难5.可以自己开启和关闭自动轮播,开启轮播的时候可以设置轮播时间间隔,默认3000毫秒 我们先来看看效果图: 然后来看看使用代码 xml代码 <?xml version

  • Android ViewPager实现轮播图效果

    先上一张效果图: 说到ViewPager实现轮播图效果,那么肯定会用到PagerAdapter,下面先介绍下这个类. PagerAdapter简介 PagerAdapter是Android.support.v4包中的类,是一个抽象类,直接继承于Object,导入包android.support.v4.view.PagerAdapter即可使用. PagerAdapter主要是viewpager的适配器,而viewPager则也是在android.support.v4扩展包中新添加的一个强大的控件

  • Android使用viewpager实现自动无限轮播图

    1.具体步骤 说下大概实现步骤,一般我们有两种,一种是viewpager+作为游标的点 .另外一种是重写viewpager. 效果图: 1.1 布局,直接viewpager+一个viewgroup就好. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:

  • Android中用RxJava和ViewPager实现轮播图

    前言 很多人要实现轮播图都会想到使用ViewPager + Handler来完成轮播图的效果.但是在RxJava快速发展的情况下,已经可以使用RxJava来代替Handler完成这样任务了. 下面我们就来介绍如何实现RxJava+ViewPager的轮播图. 效果图如下 ViewPager的操作 说到ViwePager应该大家都不陌生,它可以结合普通的View也可以结合Fragment一起使用.在此我也就不对它的使用方法进行过多的介绍了.直接开始介绍轮播的方法. 常见的轮播操作 private

  • Android Viewpager实现无限循环轮播图

    在网上找了很多viewpager实现图片轮播的,但是大多数通过以下方式在PagerAdapter的getCount()返回一个无限大的数,来实现 伪无限 @Override public int getCount() { return Integer.MAX_VALUE;//返回一个无限大的值,可以 无限循环 } 虽然通过这种方式是能达到效果,但是从严格意义上来说并不是真正的无限. 假如有五张轮播图 item的编号为(0,1,2,3,4) 要想实现 无限循环  我们在这五张的头部和尾部各加一张即

  • ViewPager打造轮播图Banner/引导页Guide

    前言 去年7月时,在Github发布了一个开源的Banner库,虽然Star不多,但还是有少部分人使用. Banner效果: Github链接地址:https://github.com/Allure0/LMBanners 昨天,有使用此库的同学提出需求,想在引导页的时候用这个库并且最后一页有进入按钮如何实现,为满足他的需求,也方便更多开发者是快速实现.进行了简单的扩展支持Guide模式的使用. Guide效果图: OK,效果如图所以,咱们此库满足了既可在Banner上使用也可以快速在第一次安装应

  • Android 使用ViewPager实现轮播图效果

    写这篇文章只是对今天所学的知识进行加深印象,对ViewPager的一些处理,比如适配器和各个方法的作用等. 先看效果图 这里我是在xml中写的圆点 Drawable文件夹下的xml代码: Shape_yes.xml: <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android">

  • 浅谈Viewpager和轮播图的冲突解决方法

    实例如下: //解决ViewPager和轮播图滑动冲突 @Override public boolean dispatchTouchEvent(MotionEvent ev) { switch (ev.getAction()) { case MotionEvent.ACTION_DOWN: // 让当前viewpager的父控件不去拦截touch事件 getParent().requestDisallowInterceptTouchEvent(true); downX = (int) ev.ge

  • viewpager实现自动循环轮播图

    本文实例为大家分享了viewpager自动循环轮播图的具体代码,供大家参考,具体内容如下 布局文件 android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <RelativeLayout android:layout_width="match_parent" and

  • android ViewPager实现自动无限轮播和下方向导圆点

    一.布局 小圆点形状的生成shape.xml文件 使用空心还是实心的把对应的注释去掉就可以了. <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" android:useLevel="false&quo

  • iOS使用UIScrollView实现无限循环轮播图效果

    本文实例为大家分享了iOS使用UIScrollView实现无限循环轮播图的具体代码,供大家参考,具体内容如下 代码: // // ViewController.m // 无限轮播 // // Created by limin on 17/8/23. // Copyright © 2017年 none. All rights reserved. // #import "ViewController.h" @interface ViewController ()<UIScrollVi

  • iOS实现无限循环轮播图效果

    本文实例为大家分享了iOS实现无限循环轮播图的具体代码,供大家参考,具体内容如下 轮播图基础控件,左滑右滑都能无限循环 预览 思路 (1)在第一张左边加一张最后一张的图片,往左滑到边缘结束后计算偏移量迅速定位成最后一张 #pragma mark - pagecontrol事件 // 这个是点击小圆点条进行切换,到边不能循环 - (void)pageControlTouched { // 点击的时候停止计时 [self.kvTimer setFireDate:[NSDate distantFutu

  • JavaScript实现循环轮播图

    本文实例为大家分享了JavaScript实现循环轮播图的具体代码,供大家参考,具体内容如下 案例演示: 1.点击下面图标,图片进行轮播 2.图片轮播完,接着轮播到第一张 (代码内部具有详细解释) 项目结构图: HTML代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>图片轮播示例</title> <link rel="

  • 无限循环轮播图之运动框架(原生JS实现)

    封装运动框架 function getStyle(obj,name){ if(obj.currentStyle){ return obj.currentStyle[name]; }else{ return getComputedStyle(obj,false)[name]; } } function move(obj,json,options){ var options=options || {}; var duration=options.duration || 800; var easing

  • 如何使用JavaScript实现无缝滚动自动播放轮播图效果

    在一些项目开发中,我们经常需要使用到轮播图,但是没有深入学习的情况下做轮播图是非常困难的. 思路 分成小问题来解决 1. 动态生成序号12345 页面有多少li(图片),就有多少序号 2. 点击序号.显示高亮.切换图片 2.1 给序号注册onclick事件 2.2 取消其他序号高亮显示,让当前点击的序号高亮显示 2.3 点击序号,动画的方式切换到当前点击的图片位置(设置自定义属性,记录当前索引,有了索引就可用动画进行移动) 3. 鼠标放到盒子上的时候显示左右箭头,移开时候隐藏 onmouseen

  • android ViewPager实现一个无限轮播图

    上节我们实现了一个图片可以无限滑动的ViewPager,这一节我们需要自定义一个ViewPager来实现我们想要展现的布局 首先我们需要建一个包,然后新建一个java类,名字随便起 这个类我们需要随便继承自一个viewGroup就行,viewGroup就是可以存放子控件的view,我们的各种layout,比如LinearLayour或者RelativeLayout这种可以在里面放东西的view,而TextView或者ImageView这种只能放内容而不能放其他view的就是普通view 然后我们

随机推荐