在使用某宝或某东购物的时候,我们会在其首页看到一个可以滑动的版块,这个版块的实现就是一个UIScrollView.在我们使用UIScrollView的时候会发现,滑动到最后的时候,UIScrollView不能像上面说的版块那样又回到最初的地方.基于此,做了一个小Demo来实现UIScrollView的无限循环滑动.

小小思路:UIScrollView具有分页属性,要实现UIScrollView的无限循环滑动,我们不能生硬暴力的给一个数组按规律的,无限的添加图片,这样手机内存还不爆炸 0.0 , 如何用最少的页面实现无限循环呢? 三个,其实只需要三个页面就可以实现UIScrollView的无限循环滑动.左丶中丶右 三个页面.刚进入程序时,左边放最后一张图片,中间第一张图片,右边放第二张.向左滑动一张图片,左边变成了第一张图片,中间是第二张,右边则变成了第三张图片.依此便可实现UIScrollView的无限循环滑动了.

Demo 如下 :

.h文件

声明一个数组来接收外部传入的图片

@interface MyScrollView: UIView <UIScrollViewDelegate>

@property(nonatomic, strong)NSArray *dataArr;

@end

.m文件

实现无线循环滑动

#define kPageCtrlHeight 37  //UIPageControl的高度

@interface MyScrollView ()
{ UIImageView *leftView;
UIImageView *centerView;
UIImageView *rightView; UIScrollView *scrollView;
UIPageControl *pageCtrl; // 页面控制器 ... NSInteger currentPageNumber;
} @end @implementation MyScrollView /*----------------始终只有左,中,右3个imgView,将数据源加入到这3个imgView中显示--------------------------*/ - (instancetype)init
{ return [self initWithFrame:[UIScreen mainScreen].bounds];
} - (instancetype)initWithFrame:(CGRect)frame
{ self = [super initWithFrame:frame];
if (self) {
[self createUI:frame];
}
return self;
} -(void)createUI:(CGRect)frame
{ scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, frame.size.width, frame.size.height - kPageCtrlHeight)];
scrollView.delegate = self;
scrollView.pagingEnabled = YES;
scrollView.showsHorizontalScrollIndicator = NO;
scrollView.showsVerticalScrollIndicator = NO; pageCtrl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, frame.size.height - kPageCtrlHeight, frame.size.width, kPageCtrlHeight)];
pageCtrl.backgroundColor = [UIColor lightGrayColor]; [self addSubview:scrollView];
[self addSubview:pageCtrl]; leftView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, scrollView.frame.size.width, scrollView.frame.size.height)];
centerView = [[UIImageView alloc] initWithFrame:CGRectMake(scrollView.frame.size.width, 0, scrollView.frame.size.width, scrollView.frame.size.height)];
rightView = [[UIImageView alloc] initWithFrame:CGRectMake(scrollView.frame.size.width*2, 0, scrollView.frame.size.width, scrollView.frame.size.height)]; [scrollView addSubview:leftView];
[scrollView addSubview:centerView];
[scrollView addSubview:rightView];
} -(void)setDataArr:(NSArray *)dataArr
{ if (![dataArr isKindOfClass:[NSArray class]] || dataArr.count == 0) {
return;
} _dataArr = dataArr; [self setInitProperty];
} -(void)setInitProperty
{ pageCtrl.numberOfPages = _dataArr.count; //总页码
//内容
scrollView.contentSize = CGSizeMake(_dataArr.count * scrollView.frame.size.width, scrollView.frame.size.height);
[scrollView setContentOffset:CGPointMake(scrollView.frame.size.width, 0)];//偏移位置,第一页 currentPageNumber = 0;
[self loadPageContent];
} -(void)loadPageContent
{ centerView.image = [UIImage imageNamed:_dataArr[currentPageNumber]]; NSInteger leftImgIndex = (currentPageNumber - 1 + _dataArr.count) % _dataArr.count;
leftView.image = [UIImage imageNamed:_dataArr[leftImgIndex]]; NSInteger rightImgIndex = (currentPageNumber + 1) % _dataArr.count;
rightView.image = [UIImage imageNamed:_dataArr[rightImgIndex]]; pageCtrl.currentPage = currentPageNumber;
} -(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView_
{ if (scrollView.contentOffset.x > scrollView.bounds.size.width) { //向左滑动
currentPageNumber = (currentPageNumber + 1) % _dataArr.count;
}else if (scrollView.contentOffset.x < scrollView.bounds.size.width){ //向右滑动
currentPageNumber = (currentPageNumber - 1 + _dataArr.count) % _dataArr.count;
} [self loadPageContent]; scrollView.contentOffset = CGPointMake(scrollView.bounds.size.width, 0);
} @end

ViewController.m 文件:

对myScrollView初始化并

调用myScrollView中dataArr setter方法即可。


关于UIScrollView无限循环滑动的更多相关文章

  1. android中无限循环滑动的gallery实例

    android中无限循环滑动的gallery实例 1.点击图片有变暗的效果,使用imageview.setAlpha(),并且添加ontouchListener public void init() ...

  2. iOS开发学习--纯代码 UIScrollView 无限循环的实现——代码类封装

    一个简单的利用UIScrollView 实现的无线滚动banner,下面的代码实现,因为封装问题,对两个及一下的view 支持出了一点问题(view是传参进来的,不可以生成两份),但是原理是正确的,智 ...

  3. Android使用ViewPager实现无限循环滑动及轮播(附源代码)

    MainActivity例如以下: package cc.ww; import java.util.ArrayList; import android.app.Activity; import and ...

  4. 详细分析Android viewpager 无限循环滚动图片

    由于最近在忙于项目,就没时间更新博客了,于是趁着周日在房间把最近的在项目中遇到的技术总结下.最近在项目中要做一个在viewpager无限滚动图片的需求,其实百度一下有好多的例子,但是大部分虽然实现了, ...

  5. android:使用gallery和imageSwitch制作可左右循环滑动的图片浏览器

    为了使图片浏览器左右无限循环滑动 我们要自己定义gallery的adapter 假设要想自己定义adapter首先要了解这几个方法 @Override public int getCount() { ...

  6. UIScrollView实现图片轮播器及其无限循环效果

    图片轮播器: 一.实现效果 实现图片的自动轮播            二.实现代码 storyboard中布局 代码: 1 #import "YYViewController.h" ...

  7. 扩展ViewFlow避免和ViewPager滑动冲突,同时支持无限循环,并完美和CircleFlowIndicator结合

    首先,为了避免滑动冲突,我们要继承ViewFlow,重写onInterceptTouchEvent public class MyViewFlow extends ViewFlow { private ...

  8. iOS开发系列--无限循环的图片浏览器

    --UIKit之UIScrollView 概述 UIKit框架中有大量的控件供开发者使用,在iOS开发中不仅可以直接使用这些控件还可以在这些控件的基础上进行扩展打造自己的控件.在这个系列中如果每个控件 ...

  9. iOS无限循环滚动scrollview

    经常有园友会问"博主,有没有图片无限滚动的Demo呀?", 正儿八经的图片滚动的Demo我这儿还真没有,今天呢就封装一个可以在项目中直接使用的图片轮播.没看过其他iOS图片无限轮播 ...

随机推荐

  1. IEC62304开发过程框架

    软件开发计划的任务 制定整体软件开发计划 制定设计和开发计划 规划软件开发的工具.标准和方法(Class C) 制定软件集成和集成计划 制定软件验证计划 制定软件风险管理计划 制定配置管理计划 软件需 ...

  2. Gitlab installtation

    环境:Centos7 安装配置(安装开启http和sshd): 1 yum -y install curl openssh-server postfix 2 systemctl enable sshd ...

  3. 细嚼慢咽C++primer(4)——类(1):构造函数,类型别名

    1  最简单地说,类即使定义了一个新的类型和一个新的作用域. 2  基础 1  构造函数 构造函数一般应使用一个构造函数初始化列表,来初始化对象的数据成员. Sales_item(): units_s ...

  4. 计算机作业(HTML简单框架网页制作) 物联网 王罗红

  5. 解决Could not commit JPA transaction RollbackException: Transaction marked as rollbackOnly

    项目测试发生问题,方法正常结束,但是报了 Could not commit JPA transaction; nested exception is javax.persistence.Rollbac ...

  6. Vuex、Flux、Redux、Redux-saga、Dva、MobX

    https://www.jqhtml.com/23003.html 这篇文章试着聊明白这一堆看起来挺复杂的东西.在聊之前,大家要始终记得一句话:一切前端概念,都是纸老虎. 不管是Vue,还是 Reac ...

  7. BZOJ3224:普通平衡树(Splay)

    Description 您需要写一种数据结构(可参考题目标题),来维护一些数,其中需要提供以下操作: 1. 插入x数 2. 删除x数(若有多个相同的数,因只删除一个) 3. 查询x数的排名(若有多个相 ...

  8. cocos2d-x中关于打包成APK的问题

    转载自:http://blog.csdn.net/u013315178/article/details/51254630 之前在网上看了很多的帖子大多数用ide 来打包 太麻烦了 而且一般没有人现场指 ...

  9. Spark Streaming和Kafka集成深入浅出

    写在前面 本文主要介绍Spark Streaming基本概念.kafka集成.Offset管理 本文主要介绍Spark Streaming基本概念.kafka集成.Offset管理 一.概述 Spar ...

  10. 用ReentrantLock和Condition实现线程间通信

    在Java多线程中,除了使用synchronize关键字来实现线程之间的同步互斥,还可以使用JDK1.5中新增的RetrantLock类来实现同样的效果.RetrantLock类的扩展功能也更加强大, ...