Android实现自动轮播图效果

本文实例为大家分享了Android实现轮播图效果展示的具体代码,供大家参考,具体内容如下

MainActivity.java

public class MainActivity extends AppCompatActivity {

 private LinearLayout ll_dots;
 private TextView viewpager_tv;

 // 将ViewPager定义为全局变量,方便使用.
 private ViewPager viewpager_vp;

 // 建立一个ArrayList集合.泛型指定为ImageView.
 ArrayList<ImageView> imageViews = new ArrayList<ImageView>();

 //创建一个handler对象,复写handlerMessage方法,用switch方法,通过msg.what得到标识.333
 private Handler handler = new Handler() {
  @Override
  public void handleMessage(Message msg) {
   switch (msg.what) {
    case 1:
     //得到当前VIewPager和用户交互的item条目.VIewPager对象.getCurrentItem 333
     int currentItem = viewpager_vp.getCurrentItem();
     //设置ViewPager当前显示的界面,得到的ITem+1
     viewpager_vp.setCurrentItem(currentItem + 1);
     //通过静态方法sendEmptyMessageDelayed,延时重复执行命令.注意不是sendEmptyMessageAtTime 333
     sendEmptyMessageDelayed(1, 3000);
     break;
    default:
     break;
   }

  }
 };

 //图片int数组资源
 private int[] imageResIds = {R.drawable.a, R.drawable.b, R.drawable.c, R.drawable.d, R.drawable.e, R.drawable.f};

 //图片字符串数组String[]资源.
 private String[] descs = {
   "网页设计师联盟",
   "教程网",
   "PS联盟",
   "25学堂",
   "课工场带你逆袭,助你走向人生巅峰",
   "当你因需求被项目经理频繁修改,而想之暴打时,请先看易老师贱笑图,你是不是更想打我了"
 };

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  //对控件进行初始化
  init();
 }

 /**
  * 对VIewPager进行初始化.
  */
 private void init() {
  //找到可以设置点的容器LinearLayout的对象,进行点的添加
  ll_dots = (LinearLayout) findViewById(R.id.ll_dots);
  //找到文本的对象.
  viewpager_tv = (TextView) findViewById(R.id.viewpager_tv);
  //找到VIewPager对象.
  viewpager_vp = (ViewPager) findViewById(R.id.viewpager_vp);

  //更加图片int数组资源的数量,动态的创建ImageView控件.就是有几张图片,创建几个ImageView,for循环
  for (int x = 0; x < imageResIds.length; x++) {
   //创建ImageView对象
   ImageView imageView = new ImageView(this);
   //通过该对象添加图片资源.setBackgroundResource方法.
   imageView.setBackgroundResource(imageResIds[x]);
   //把控件添加到集合ImageViews中去,以方便在VIewPager的适配器里instantiateItem方法获取.
   imageViews.add(imageView);
   //进行点的添加,其个数和图片的个数一致,因此放到该循环中.222
   dot();
  }

  //设置适配器.setAdapter
  viewpager_vp.setAdapter(new Myadapter());
  //设置ViewPager的滑动监听器,addOnPageChangeListener,set的方法因为名字的原因被淘汰了,在onPageScrolled中.222
  viewpager_vp.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {

   @Override
   public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
    //同过getCurrentItem方法拿到当前用户所交互ViewPager的item位置.
    int currentItem = viewpager_vp.getCurrentItem();
    //通过得到的这个item,给text和点进行选中的设置.
    changeTextAndDot(currentItem % imageResIds.length);
    Log.d("aaa", "onPageScrolled: Position-" + position + " positionOffset-" + positionOffset + " positionOffsetPixels-" + positionOffsetPixels);

   }

   @Override
   public void onPageSelected(int position) {
    Log.d("aaa", "onPageSelected: position" + position);
   }

   @Override
   public void onPageScrollStateChanged(int state) {
    Log.d("aaa", "onPageScrollStateChanged: state" + state);
   }
  });
  //指定VIewPager默认跳转到某页.一般是最大数的一般.setCurrentItem就是设置VIewPager跳到哪页,get是获取.333
  viewpager_vp.setCurrentItem(Integer.MAX_VALUE / 2 - 3);

  //通过handler,3秒后开始循环ViwePager的item.sendEmptyMessageDelayed,333
  handler.sendEmptyMessageDelayed(1, 3000);
  //设置VIewPager的触摸事件.最后抽成方法.333
  ViewPagerTouchEvent();
 }

 /**
  * 注意:看一个方法或类的信息快捷键:Ctrl+Q;
  * 像ListVIew一样,创建一个ViewPager的适配器,自定义一个类继承PagerAdapter
  */
 private class Myadapter extends PagerAdapter {
  //getContent,设置ViewPager的条目个数.一般就是集合或者资源数组的长度.
  @Override
  public int getCount() {
   //把返回的条目设置为无限大.333
   //注意:一般和获取ViewPager当前选中的是第几页有关的都要改为position(当前页数)%list.size()(取余数),你就看哪报错,根据报错改333
   return Integer.MAX_VALUE;
  }

  //isViewFromObject,判断ViewPager的条目View对象和InstantiateItem返回的Object对象是否一致,固定格式:return view==object;
  @Override
  public boolean isViewFromObject(View view, Object object) {
   return view == object;
  }

  //Ctrl+H:看到一个类的基础结构图 ctrl+h+l:快速格式化.
  //instantiateItem,ViewPager添加条目的操作.container:VIewPager的化身,控件都是添加到他身上,position:代表用户滑动条目的位置
  @Override
  public Object instantiateItem(ViewGroup container, int position) {
   //根据条目所在位置(利用Position),从ImageViews集合里获取相对应的ImageVIew图片.
   ImageView imageView = imageViews.get(position % imageResIds.length);
   //把得到ImageView对象,添加给VIewPager对象,也就是container,使用addView
   container.addView(imageView);
   //注意:你添加给VIewPager什么控件,就要返回该控件,给isViewFromObject进行比较判断,这里添加的是ImageView,返回的就是ImageView
   return imageView;
  }

  //防止内存泄漏.相当于ListView的复用container,销毁一个page,该方法的实际就是将instantiateItem返回的VIew对象从ViewPager中移除,
  //container:还是ViewPager控件自身 position: object:则代表了View控件,使用时要强转成View一下
  //补充:为什么参数是Object,而不直接是View,因为虽然99%是view,但也有可能是Fragment,所以用Object,提高了可扩展性.
  @Override
  public void destroyItem(ViewGroup container, int position, Object object) {
   //构造方法删除后,也是固定格式:container.removeView((View) object);
   container.removeView((View) object);
  }
 }

 /**
  * 更加图片资源的数量,动态的创建点222
  */
 public void dot() {
  //创建一个View对象;
  View view = new View(this);
  //为这个View对象设置背景setBackgroundResource
  view.setBackgroundResource(R.drawable.dot_normal);
  //为View对象设置宽高参数,使用参数对象LayoutParams(int,int),给哪个容器,就用哪个容器创建
  LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(8, 8);
  //使用参数对象LayoutParams.leftMargin=int,相当于布局里的padding.
  layoutParams.leftMargin = 8;
  //把准备好的layoutParams参数对象,设置给View对象.setLayoutParams
  view.setLayoutParams(layoutParams);
  //最后容器对象.addView(VIwe);
  ll_dots.addView(view);
 }

 /**
  * 根据ViewPager的item的变化,也就是图片切换的操作,设置对应的点和文本.222
  *
  * @param position int ViewPager的item,也是图片的位置
  */
 public void changeTextAndDot(int position) {
  //根据ViewPager的item的变化,设置对应的文本.setText(descs[position]);
  viewpager_tv.setText(descs[position]);
  //对点进行判断是否是当前页的点,用for循环,拿到所有点的位置,然后和position对比
  for (int x = 0; x < imageResIds.length; x++) {
   //.getChildAt(x);拿到容器的子控件.得到VIew对象
   View childAt = ll_dots.getChildAt(x);
   //为View设置背景图片,,使用三元运算符.
   childAt.setBackgroundResource(x == position ? R.drawable.dot_focus : R.drawable.dot_normal);
  }
 }

 /**
  * 该方法主要设置VIewPager的触摸事件,实现用户的触摸时,不再自动播放.switch中motionEvent.getActivity.333
  * 另一种实现的思路,是在ViewPager监听事件里面,对ViewPager的状态进行判断.闲置-滑动,和用户交互中-移除滑动.
  * public void onPageScrollStateChanged(int state) {
  * //当滑动状态发生改变的时候,手动滑动的时候,不能进行界面切换操作
  * //SCROLL_STATE_IDLE : 空闲状态
  * if (state == ViewPager.SCROLL_STATE_IDLE) {
  * //自动切换界面
  * handler.sendEmptyMessageDelayed(VIEWPAGER_SWITCH_PAGE, 3000);
  * }else{
  * //停止自动切换
  * //停止界面切换操作
  * handler.removeMessages(VIEWPAGER_SWITCH_PAGE);
  * }
  * }
  */
 public void ViewPagerTouchEvent() {
  viewpager_vp.setOnTouchListener(new View.OnTouchListener() {
   @Override
   public boolean onTouch(View view, MotionEvent motionEvent) {
    switch (motionEvent.getAction()) {
     case MotionEvent.ACTION_DOWN:
      //当时MotionEvent.ACTION_DOWN和ACTION_MOVE,就移除handler发送的message.removeMessages.333
      handler.removeMessages(1);
      break;
     case MotionEvent.ACTION_MOVE:
      handler.removeMessages(1);
      break;
     //当用户手松开时ACTION_UP,就继续使用sendEmptyMessageDelayed发送handler的消息.333
     case MotionEvent.ACTION_UP:
      handler.sendEmptyMessageDelayed(1, 3000);
     default:
      break;
    }
    return false;
   }
  });
 }

 @Override
 protected void onDestroy() {
  super.onDestroy();
  handler.removeMessages(1);
 }
}

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent">
 <android.support.v4.view.ViewPager
  android:id="@+id/viewpager_vp"
  android:layout_width="wrap_content"
  android:layout_height="300dp" />
 <!-- 定义lineatLayout时,background="#88000000",gravity="center_horizontal" padding="8dp"
   android:layout_alignBottom="@+id/viewpager_vp" 小点用一个LinearLayout来包裹.-->
 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="#88000000"
  android:gravity="center_horizontal"
  android:padding="8dp"
  android:layout_alignBottom="@+id/viewpager_vp"
  android:orientation="vertical">
  <!--此处状态选择器的选择属性是state_selected,而不是state_pressed,
   要知道他们的区别,引用图片drawable,注意V是大写,
   点是根据图片的张数,动态创建的,所有我们的View还要注释掉.-->text
  <TextView
   android:id="@+id/viewpager_tv"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:textColor="@android:color/white"
   android:text="我是帅哥"/>

  <LinearLayout
   android:id="@+id/ll_dots"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:orientation="horizontal"
   android:gravity="center_horizontal">
<!--   <View
    android:layout_width="5dp"
    android:layout_height="5dp"
    android:background="@drawable/dot_focus"/>-->
  </LinearLayout>
 </LinearLayout>
</RelativeLayout>

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

(0)

相关推荐

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

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

  • Android开发在轮播图片上加入点击事件的方法

    这是我加在里面的代码,用Switch(position) 来获取当前图片,在相应的图片上加入点击事件, case  0:, case 1: 时代码如下,当点击第一张图片时,想实现case 0里面的代码,但是直接直接报错,退出,当点击第二张实现case 1中的代码时却是没问题,我想知道到底哪里不对啊. 对了,这些代码是在Fragemnt内写的,点击图片时是要从一个Fragment转到一个Activity,求大神指教

  • Android自定义控件实现优雅的广告轮播图

    前言 今天给大家带来一个新的控件–轮播图,网上已经有很多这类的博客来讲解如何实现的,那么我的这个有哪些特点呢?或是说有哪些不同呢? 满足了轮播图的基本要求,循环滑动,在最后一张切到第一张时可以平稳的过渡 简洁简洁简洁 扩展性强 如何使用 下面我们先展示两种效果图 1 默认效果 代码实现 //布局代码 <com.landptf.view.BannerM android:id="@+id/bm_banner" android:layout_width="match_pare

  • Android自定义控件实现简单的轮播图控件

    最近要做一个轮播图的效果,网上看了几篇文章,基本上都能找到实现,效果还挺不错,但是在写的时候感觉每次都要单独去重新在Activity里写一堆代码.于是自己封装了一下.本篇轮播图实现原理原文出处:循环广告位组件的实现,这里只是做了下封装成一个控件,不必每次重复写代码了. 效果图: 实现分析 轮播图的功能就是实现左右滑动的广告.图片信息展示,那我们就用ViewPager来实现,由于考虑到用户体验,我们还需要在下面加一个指示器来标示滑动到了第几张轮播图.指示器我们可以用一个线性布局来根据要展示的轮播图

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

    本文实例为大家分享了Android轮播图无限循环的具体代码,供大家参考,具体内容如下 实现无限循环 在getCount()方法中,返回一个很大的值,Integer.MAX_VALUE 在instantiateItem()方法中,获取当前View的索引时,进行取于操作,传递进来的int position是个非常大的数,对他进行求余数 在destroyItem()方法中,同样 在onPageSelected()监听方法中,对传递进来的索引进行取于 反向的无限循环 调用ViewPager对象的setC

  • Android如何使用RecyclerView打造首页轮播图

    先看看效果图: 停在中间自动翻页 序言:最近接到一个任务,做一个类似上面自动翻页的功能.可以看到,这一屏中有三张图片显示出来了,有两张没有显示完全,看到设计图的时候第一反应是可以用viewpager来实现,但是任务却跟你开了一个天大的玩笑,要求是以最左边的图片为基准,也就是说,左边的图片也得显示完全,就像下图所示,后来仔细想想viewpager好像没有这样的功能,也有可能是我不知道,我也没有找到这样的文章或者信息,希望知道的简友私戳交流一下,感激不尽,好了,言归正传 停在左边 在开始之前呢,首先

  • Android下拉刷新与轮播图滑动冲突解决方案

    最近在开发中遇到了这样一个问题,在下拉刷新组件中包含了一个轮播图组件,当左右滑动的图片时很容易触发下拉刷新,如下图所示: 如图中红色箭头所示方向切换轮播图,很容易触发下拉刷新.网上查了很多方法,发现都不能很好的解决,于是自己研究了下. 我选用的第三方控件 1.下拉刷新我选用的是chanven的CommonPullToRefresh(系统自带的SwipeRefreshLayout也应该是一样的道理); 2.轮播图选用的是daimajia的AndroidImageSlider(用ViewPager也

  • Android ViewPager实现轮播图效果

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

  • 简单实现android轮播图

    轮播图是很常用的一个效果 核心功能已经实现 没有什么特殊需求 自己没事研究的 所以封装的不太好 一些地方还比较糙 为想要研究轮播图的同学提供个参考 目前测试图片为mipmap中的图片 没有写从网络加载图片 可自行根据需求在getShowView()方法中修改 1.定时切换 通过handle延时发送通知改变界面 然后在切换viewpage的界面之后 再次发送此延时通知 就ok咯 还可以通过timer定时器实现 2.无限轮播效果 如果我们只是在自动轮播到最后一页 然后进行判断让切换到第一页 这样是可

  • Android实现ViewPage轮播图效果

    在android移动端的开发中,首页轮播图是一个特别常见的功能,所以今天就来将最近写的一个小demo记录一下. 首先当然是新建一个项目代码如下: activity_main.xml文件: <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:to

随机推荐