Android实现图片自动轮播并且支持手势左右无限滑动

废话不多说了，先给大家上左右无限滑动的代码了。

1.左右无限滑动

public class MainActivity extends AppCompatActivity {
private static ViewPager viewPager;
private RadioGroup group;
//图片资源，实际项目需要从网络获取
private int[] imageIds = {R.drawable.ym1, R.drawable.ym2, R.drawable.ym3, R.drawable.ym4};
//存放图片的数组
private List<ImageView> mList;
//当前索引位置以及上一个索引位置
private static int index = 0, preIndex = 0;
//是否需要轮播标志
private boolean isContinue = true;
//定时器，用于实现轮播
private Timer timer = new Timer();
private MyHandler mHandler;
public static class MyHandler extends Handler {
private WeakReference<MainActivity> weakReference;
public MyHandler(MainActivity activity) {
weakReference = new WeakReference<>(activity);
}
@Override
public void handleMessage(Message msg) {
if (weakReference.get() != null) {
index++;
viewPager.setCurrentItem(index);
}
super.handleMessage(msg);
}
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initData();
addListener();
//让当前图片位于中间某个位置，目的就是为了开始能够左滑
viewPager.setCurrentItem(imageIds.length * 100);
initRadioButton(imageIds.length);//注意这句和上面那句顺序不能写反，否则会出现第一个圆点无法显示选中状态
startSwitch();
}
/**
* 初始化控件
*/
public void initView() {
viewPager = (ViewPager) findViewById(R.id.viewpager);
group = (RadioGroup) findViewById(R.id.group);
}
/**
* 初始化数据
*/
public void initData() {
mList = new ArrayList<>();
viewPager.setAdapter(pagerAdapter);
mHandler = new MyHandler(this);
}
/**
* 添加监听
*/
public void addListener() {
viewPager.addOnPageChangeListener(onPageChangeListener);
viewPager.setOnTouchListener(onTouchListener);
}
/**
* 进行图片轮播
*/
public void startSwitch() {
//执行定时任务
timer.schedule(new TimerTask() {
@Override
public void run() {
//首先判断是否需要轮播，是的话我们才发消息
if (isContinue) {
mHandler.sendEmptyMessage(1);
}
}
}, 3000, 3500);//延迟3秒，每隔3.5秒发一次消息;
}
/**
* 根据图片个数初始化按钮
* @param length 图片所在集合长度
*/
private void initRadioButton(int length) {
for (int i = 0; i < length; i++) {
ImageView imageview = new ImageView(this);
imageview.setImageResource(R.drawable.rg_selector);//设置背景选择器
imageview.setPadding(20, 0, 0, 0);//设置每个按钮之间的间距
//将按钮依次添加到RadioGroup中
group.addView(imageview, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
//默认选中第一个按钮，因为默认显示第一张图片
group.getChildAt(0).setEnabled(false);
}
}
/**
* 根据当前触摸事件判断是否要轮播
*/
View.OnTouchListener onTouchListener = new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
//手指按下和划动的时候停止图片的轮播
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
isContinue = false;
break;
default:
isContinue = true;
}
return false;//注意这里只能返回false,如果返回true，Dwon就会消费掉事件，MOVE无法获得事件，
// 导致图片无法滑动
}
};
/**
* 根据当前选中的页面设置按钮的选中
*/
ViewPager.OnPageChangeListener onPageChangeListener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
index = position;//当前位置赋值给索引
setCurrentDot(index % imageIds.length);//因为只有四个按钮，所以我们在此要对长度区域，保证范围在0到4
}
@Override
public void onPageScrollStateChanged(int state) {
}
};
/**
* 设置对应位置按钮的状态
* @param i 当前位置
*/
private void setCurrentDot(int i) {
if (group.getChildAt(i) != null) {
group.getChildAt(i).setEnabled(false);//当前按钮选中,显示蓝色
}
if (group.getChildAt(preIndex) != null) {
group.getChildAt(preIndex).setEnabled(true);//上一个取消选中。显示灰色
preIndex = i;//当前位置变为上一个，继续下次轮播
}
}
PagerAdapter pagerAdapter = new PagerAdapter() {
@Override
public int getCount() {
//返回一个比较大的值，目的是为了实现无限轮播
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
position = position % imageIds.length;//因为position非常大，而我们需要的position不能大于图片集合长度
//所以在此取余
ImageView imageView = new ImageView(MainActivity.this);
imageView.setImageResource(imageIds[position]);
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
container.addView(imageView);
mList.add(imageView);
return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
// 注意在此不要做任何操作，因为我们需要实现向左滑动，否则会产生IndexOutOfBoundsException
}
};
@Override
protected void onDestroy() {
super.onDestroy();
//页面销毁的时候取消定时器
if (timer != null) {
preIndex = 0;
timer.cancel();
}
}
}

2.单向滑动

public class MainActivity extends AppCompatActivity {
private static ViewPager viewPager;
private RadioGroup group;
//图片资源，实际项目需要从网络获取
private int[] imageIds = {R.drawable.ym1, R.drawable.ym2, R.drawable.ym3, R.drawable.ym4};
//存放图片的数组
private List<ImageView> mList;
//当前索引位置以及上一个索引位置
private static int index = 0, preIndex = 0;
//是否需要轮播标志
private boolean isContinue = true;
//定时器，用于实现轮播
private Timer timer = new Timer();
private MyHandler mHandler;
public static class MyHandler extends Handler {
private WeakReference<MainActivity> weakReference;
public MyHandler(MainActivity activity) {
weakReference = new WeakReference<>(activity);
}
@Override
public void handleMessage(Message msg) {
if (weakReference.get() != null) {
index++;
viewPager.setCurrentItem(index);
}
super.handleMessage(msg);
}
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initData();
addListener();
initRadioButton(imageIds.length);
startSwitch();
}
/**
* 初始化控件
*/
public void initView() {
viewPager = (ViewPager) findViewById(R.id.viewpager);
group = (RadioGroup) findViewById(R.id.group);
}
/**
* 初始化数据
*/
public void initData() {
mList = new ArrayList<>();
viewPager.setAdapter(pagerAdapter);
mHandler = new MyHandler(this);
}
/**
* 添加监听
*/
public void addListener() {
viewPager.addOnPageChangeListener(onPageChangeListener);
viewPager.setOnTouchListener(onTouchListener);
}
/**
* 进行图片轮播
*/
public void startSwitch() {
//执行定时任务
timer.schedule(new TimerTask() {
@Override
public void run() {
//首先判断是否需要轮播，是的话我们才发消息
if (isContinue) {
mHandler.sendEmptyMessage(1);
}
}
}, 3000, 3500);//延迟3秒，每隔3.5秒发一次消息;
}
/**
* 根据图片个数初始化按钮
* @param length 图片所在集合长度
*/
private void initRadioButton(int length) {
for (int i = 0; i < length; i++) {
ImageView imageview = new ImageView(this);
imageview.setImageResource(R.drawable.rg_selector);//设置背景选择器
imageview.setPadding(20, 0, 0, 0);//设置每个按钮之间的间距
//将按钮依次添加到RadioGroup中
group.addView(imageview, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
//默认选中第一个按钮，因为默认显示第一张图片
group.getChildAt(0).setEnabled(false);
}
}
/**
* 根据当前触摸事件判断是否要轮播
*/
View.OnTouchListener onTouchListener = new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
//手指按下和划动的时候停止图片的轮播
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
isContinue = false;
break;
default:
isContinue = true;
}
return false;//注意这里只能返回false,如果返回true，Dwon就会消费掉事件，MOVE无法获得事件，
// 导致图片无法滑动
}
};
/**
* 根据当前选中的页面设置按钮的选中
*/
ViewPager.OnPageChangeListener onPageChangeListener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
index = position;//当前位置赋值给索引
setCurrentDot(index % imageIds.length);//因为只有四个按钮，所以我们在此要对长度区域，保证范围在0到4
}
@Override
public void onPageScrollStateChanged(int state) {
}
};
/**
* 设置对应位置按钮的状态
* @param i 当前位置
*/
private void setCurrentDot(int i) {
if (group.getChildAt(i) != null) {
group.getChildAt(i).setEnabled(false);//当前按钮选中,显示蓝色
}
if (group.getChildAt(preIndex) != null) {
group.getChildAt(preIndex).setEnabled(true);//上一个取消选中。显示灰色
preIndex = i;//当前位置变为上一个，继续下次轮播
}
}
PagerAdapter pagerAdapter = new PagerAdapter() {
@Override
public int getCount() {
//返回一个比较大的值，目的是为了实现无限轮播
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
position = position % imageIds.length;//因为position非常大，而我们需要的position不能大于图片集合长度
//所以在此取余
ImageView imageView = new ImageView(MainActivity.this);
imageView.setImageResource(imageIds[position]);
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
container.addView(imageView);
mList.add(imageView);
return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(mList.get(position));
}
};
@Override
protected void onDestroy() {
super.onDestroy();
//页面销毁的时候取消定时器
if (timer != null) {
preIndex = 0;
index = 0;
timer.cancel();
}
}
}

3.加入一张图片的判断(最终版)

public class MainActivity extends AppCompatActivity {
private static ViewPager viewPager;
private RadioGroup group;
//图片资源，实际项目需要从网络获取
// private int[] imageIds = {R.drawable.ym1, R.drawable.ym2, R.drawable.ym3, R.drawable.ym4};
private int[] imageIds = {R.drawable.ym1};
//存放图片的数组
private List<ImageView> mList;
//当前索引位置以及上一个索引位置
private static int index = 0, preIndex = 0;
//是否需要轮播标志
private boolean isContinue = true;
//定时器，用于实现轮播
private Timer timer = new Timer();
private MyHandler mHandler;
public static class MyHandler extends Handler {
private WeakReference<MainActivity> weakReference;
public MyHandler(MainActivity activity) {
weakReference = new WeakReference<>(activity);
}
@Override
public void handleMessage(Message msg) {
if (weakReference.get() != null) {
index++;
viewPager.setCurrentItem(index);
}
super.handleMessage(msg);
}
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initData();
addListener();
initRadioButton(imageIds.length);//注意这句和上面那句顺序不能写反，否则会出现第一个圆点无法显示选中状态
startSwitch();
}
/**
* 初始化控件
*/
public void initView() {
viewPager = (ViewPager) findViewById(R.id.viewpager);
group = (RadioGroup) findViewById(R.id.group);
}
/**
* 初始化数据
*/
public void initData() {
mList = new ArrayList<>();
viewPager.setAdapter(pagerAdapter);
mHandler = new MyHandler(this);
}
/**
* 添加监听
*/
public void addListener() {
viewPager.addOnPageChangeListener(onPageChangeListener);
viewPager.setOnTouchListener(onTouchListener);
}
/**
* 进行图片轮播
*/
public void startSwitch() {
//执行定时任务
timer.schedule(new TimerTask() {
@Override
public void run() {
//首先判断是否需要轮播，是的话我们才发消息
if (isContinue) {
if(imageIds.length!=1)//多于一张图片才轮播
mHandler.sendEmptyMessage(1);
}
}
}, 3000, 3500);//延迟3秒，每隔3.5秒发一次消息;
}
/**
* 根据图片个数初始化按钮
* @param length 图片所在集合长度
*/
private void initRadioButton(int length) {
for (int i = 0; i < length; i++) {
ImageView imageview = new ImageView(this);
if(length == 1){
imageview.setVisibility(View.GONE);
return;
}
imageview.setImageResource(R.drawable.rg_selector);//设置背景选择器
imageview.setPadding(20, 0, 0, 0);//设置每个按钮之间的间距
//将按钮依次添加到RadioGroup中
group.addView(imageview, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
//默认选中第一个按钮，因为默认显示第一张图片
group.getChildAt(0).setEnabled(false);
}
}
/**
* 根据当前触摸事件判断是否要轮播
*/
View.OnTouchListener onTouchListener = new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
//手指按下和划动的时候停止图片的轮播
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
isContinue = false;
break;
default:
isContinue = true;
}
if(imageIds.length == 1){
return true;//1张图片不允许滑动
}
return false;//注意这里只能返回false,如果返回true，Dwon就会消费掉事件，MOVE无法获得事件，
// 导致图片无法滑动
}
};
/**
* 根据当前选中的页面设置按钮的选中
*/
ViewPager.OnPageChangeListener onPageChangeListener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
index = position;//当前位置赋值给索引
setCurrentDot(index % imageIds.length);//因为只有四个按钮，所以我们在此要对长度区域，保证范围在0到4
}
@Override
public void onPageScrollStateChanged(int state) {
}
};
/**
* 设置对应位置按钮的状态
* @param i 当前位置
*/
private void setCurrentDot(int i) {
if (group.getChildAt(i) != null) {
group.getChildAt(i).setEnabled(false);//当前按钮选中,显示蓝色
}
if (group.getChildAt(preIndex) != null) {
group.getChildAt(preIndex).setEnabled(true);//上一个取消选中。显示灰色
preIndex = i;//当前位置变为上一个，继续下次轮播
}
}
PagerAdapter pagerAdapter = new PagerAdapter() {
@Override
public int getCount() {
//返回一个比较大的值，目的是为了实现无限轮播
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
position = position % imageIds.length;//因为position非常大，而我们需要的position不能大于图片集合长度
//所以在此取余
ImageView imageView = new ImageView(MainActivity.this);
imageView.setImageResource(imageIds[position]);
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
container.addView(imageView);
mList.add(imageView);
return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
// 注意在此不要做任何操作，因为我们需要实现向左滑动，否则会产生IndexOutOfBoundsException
container.removeView(mList.get(position));
}
};
@Override
protected void onDestroy() {
super.onDestroy();
//页面销毁的时候取消定时器
if (timer != null) {
preIndex = 0;
index = 0;
timer.cancel();
}
}
}

以上所述是小编给大家介绍的Android实现图片自动轮播并且支持手势左右无限滑动，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • Android实现图片左右滑动效果

    Android实现图片左右滑动效果

    关于滑动效果,在Android中用得比较多,本示例实现的滑动效果是使用ViewFlipper来实现的,当然也可以使用其它的View来实现.接下来就让我们开始实现这种效果. 接下来我们看一下程序结构图: MainActivity文件中代码: package com.android.flip; import android.app.Activity; import android.os.Bundle; import android.view.GestureDetector; import andro

  • Android开发之使用ViewPager实现图片左右滑动切换效果

    Android中图片的左右切换随处可见,今天我也试着查阅资料试着做了一下,挺简单的一个小Demo,却也发现了一些问题,话不多说,上代码~: 使用了3个xml文件作为ViewPager的滑动page,布局都是相同的,如下只展示其中之一: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/

  • Android实现Banner界面广告图片循环轮播（包括实现手动滑动循环）

    Android实现Banner界面广告图片循环轮播（包括实现手动滑动循环）

    前言:经常会看到有一些app的banner界面可以实现循环播放多个广告图片和手动滑动循环.本以为单纯的ViewPager就可以实现这些功能.但是蛋疼的事情来了,ViewPager并不支持循环翻页.所以要实现循环还得需要自己去动手.自己在网上也找了些例子,本博文的Demo是结合自己找到的一些相关例子的基础上去改造,也希望对读者有用. Demo实现的效果图如下: Demo代码: 工程目录如下图: 废话不多说,上代码. 1.主Activity代码如下: package com.stevenhu.and

  • Android 自定义 HorizontalScrollView 打造多图片OOM 的横向滑动效果(实例代码)

    Android 自定义 HorizontalScrollView 打造多图片OOM 的横向滑动效果(实例代码)

    自从Gallery被谷歌废弃以后,Google推荐使用ViewPager和HorizontalScrollView来实现Gallery的效果.的确HorizontalScrollView可以实现Gallery的效果,但是HorizontalScrollView存在一个很大的问题,如果你仅是用来展示少量的图片,应该是没问题的,但是如果我希望HorizontalScrollView可以想ViewPager一样,既可以绑定数据集(动态改变图片),还能做到,不管多少图片都不会OOM(ViewPager内

  • Android 使用ViewPager实现图片左右循环滑动自动播放

    Android 使用ViewPager实现图片左右循环滑动自动播放

    ViewPager这个小demo实现的是可以左右循环滑动图片,下面带索引,滑到最后一页在往右滑动就要第一页,第一页往左滑动就到最后一页,先上效果图,用美女图片是我一贯的作风,呵呵 1. 首先看一些layout下的xml <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_

  • Android实现图片自动轮播并且支持手势左右无限滑动

    废话不多说了,先给大家上左右无限滑动的代码了. 1.左右无限滑动 public class MainActivity extends AppCompatActivity { private static ViewPager viewPager; private RadioGroup group; //图片资源,实际项目需要从网络获取 private int[] imageIds = {R.drawable.ym1, R.drawable.ym2, R.drawable.ym3, R.drawab

  • bootstrap实现图片自动轮播

    bootstrap实现图片自动轮播

    bootstrap图片自动轮播效果图: 代码实现: <!DOCTYPE html> <html lang="zh-CN"> <head> <link rel="stylesheet" href="bootstrap.min.css" /> <link rel="stylesheet" href="bootstrap-theme.min.css" />

  • java制作广告图片自动轮播控件

    首页图片的轮播 /** * 广告图片自动轮播控件</br> * */ public class ImageCycleView extends LinearLayout { /** * 上下文 */ private Context mContext; /** * 图片轮播视图 */ private ViewPager mAdvPager = null; /** * 滚动图片视图适配 */ private ImageCycleAdapter mAdvAdapter; /** * 图片轮播指示器控件

  • 详解android 视频图片混合轮播实现

    详解android 视频图片混合轮播实现

    循环添加视频view  图片view for (int i = 0 ;i<beansArrayList.size();i++){ if (beansArrayList.get(i).getType()==1){ videoPlayer = new NiceVideoPlayer(this); controller = new TxVideoPlayerController(this); videoPlayer.setController(controller); videoPlayer.setU

  • JS实现简易图片自动轮播

    本文实例为大家分享了JS实现简易图片自动轮播的具体代码,供大家参考,具体内容如下 <!doctype html> <html> <head> <meta charset="utf-8" /> <title>自动播放选项卡</title> <style> *{ margin:0; padding:0; } .box{ width:600px; height:400px; border:1px solid

  • jquery实现图片自动轮播效果

    jquery实现图片自动轮播效果

    本文实例为大家分享了jquery实现图片自动轮播效果的具体代码,供大家参考,具体内容如下 HTML代码如下: <div id="container">             <img src="icon1.jpg" class="left">             <img src="icon2.jpg" class="right">         <div

  • Android实现图片文字轮播特效

    Android实现图片文字轮播特效

    本文实例讲解了Android实现图片文字轮播特效的详细代码,分享给大家供大家参考,具体内容如下 图片轮播是类似知乎日报上的一个轮播效果,如下图. 好了直接进入正题,首先是出示一下效果: MainActivity: import java.util.ArrayList; import java.util.List; import java.util.concurrent.Executors; import java.util.concurrent.ScheduledExecutorService;

  • js图片自动轮播代码分享(js图片轮播)

    1.利用图片width显示位置来播放图片,技术:.offsetWidth .aBtn[i].index = i .setInterval() .oUl[0].style.left =  .onclick()2.利用数组放入图片经行轮播,技术:setInterval().没有onclick() 图片轮播12js.html 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   "http:

  • 用box固定长宽实现图片自动轮播js代码

    这个小DEMO,主要用box固定长宽用于显示图片,将图片放入imagebox中,连接起来,每次换图片则将imagebox的style属性的margin-left改动,能形成轮播的效果. 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <

  • Android实现图片轮播效果的两种方法

    大家在使用APP的过程中,经常会看到上部banner图片轮播的效果,那么今天我们就一起来学习一下,android中图片轮询的几种实现方法: 第一种:使用动画的方法实现:(代码繁琐) 这种发放需要:两个动画效果,一个布局,一个主类来实现,不多说了,来看代码吧: public class IamgeTrActivity extends Activity { /** Called when the activity is first created. */ public ImageView image

随机推荐