• 简介
  • 分析
  • 实现
  • 代码下载

一、简介

在实际的开发当中,会经常有界面需要实现图片的无限轮播这样的需求。比如新闻app,或者其他app的广告位

实现的方式有很多种,最先想动的一定是scrollView,但是其实scrollView实现起来并没有那么容易。这里,我用了一个较为取巧的办法,使用UICollectionView来实现无限轮播

二、分析

无限轮播,通常就是图片的无限循环的播放。当到最后一个图片的时候,再次轮播时,显示第一个图片。

UICollectionView可以进行上下滚动,也可以进行左右滚动,所有这里我们只需要使用它,并且让它左右滚动即可

我这里将整个内容封装到一个View里面,使用起来较为简单,另外代码中注释也很清晰,这里不做阐述。

三、实现

1⃣️在主控制器中创建广告位

/**
* 加载数据
*/
- (void)loadData
{
NSURL *dataUrl = [[NSBundle mainBundle] URLForResource:@"newses.plist" withExtension:nil];
NSArray *data = [NSArray arrayWithContentsOfURL:dataUrl];
NSMutableArray *tempArray = [NSMutableArray array];
for (NSDictionary *dict in data) {
AdvertModel *advert = [AdvertModel advertModelWithDict:dict];
[tempArray addObject:advert];
}
_advertData = tempArray;
} - (void)createAdvertView
{
CGRect advertRect = CGRectMake(, , , );
AdvertView *advertView = [[AdvertView alloc] initWithFrame:advertRect];
advertView.advertData = _advertData;
[self.view addSubview:advertView];
}

2⃣️广告位的View的实现

#import "AdvertView.h"
#import "AdvertModel.h"
#import "AdvertCell.h" #define cellIdentifier @"advertcell" @interface AdvertView() <UICollectionViewDataSource, UICollectionViewDelegate>
{
UICollectionView *_advertView;
UIPageControl *_pageControl; NSTimer *_timer; NSInteger _width;
NSInteger _height;
}
@end @implementation AdvertView - (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
//1.设置宽高
_width = frame.size.width;
_height = frame.size.height; //2.创建广告位和PageControl
[self createAdvertView];
[self createPageView]; //3.创建定时器
[self addTimer];
}
return self;
} /**
* 加载数据
*/
- (void)setAdvertData:(NSArray *)advertData
{
_advertData = advertData;
[_advertView reloadData]; [_advertView scrollToItemAtIndexPath:[NSIndexPath indexPathForItem: inSection:] atScrollPosition:UICollectionViewScrollPositionLeft animated:NO];
} /**
* 创建广告位
*/
- (void)createAdvertView
{
UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
flowLayout.minimumLineSpacing = ;
flowLayout.minimumInteritemSpacing = ;
flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
flowLayout.itemSize = CGSizeMake(_width, _height); CGRect advertRect = CGRectMake(, , _width, _height);
_advertView = [[UICollectionView alloc] initWithFrame:advertRect collectionViewLayout:flowLayout];
[_advertView registerClass:[AdvertCell class] forCellWithReuseIdentifier:cellIdentifier];
_advertView.delegate = self;
_advertView.dataSource = self;
_advertView.pagingEnabled = YES;
_advertView.showsHorizontalScrollIndicator = NO;
_advertView.showsVerticalScrollIndicator = NO;
[self addSubview:_advertView];
} /**
* 创建页码的View
*/
- (void)createPageView
{
UIPageControl *pageControl = [[UIPageControl alloc] init];
pageControl.center = CGPointMake(self.frame.size.width * 0.5, _height - );
pageControl.bounds = CGRectMake(, , , );
pageControl.numberOfPages = ;
pageControl.pageIndicatorTintColor = [UIColor blueColor];
pageControl.currentPageIndicatorTintColor = [UIColor redColor];
[self addSubview:pageControl];
_pageControl = pageControl;
} /**
* 添加定时器
*/
- (void)addTimer
{
NSTimer *timer = [NSTimer scheduledTimerWithTimeInterval:2.0 target:self selector:@selector(nextAdvert) userInfo:nil repeats:YES];
[[NSRunLoop mainRunLoop] addTimer:timer forMode:NSRunLoopCommonModes];
_timer = timer;
}
/**
* 删除定时器
*/
- (void)removeTimer
{
[_timer invalidate];
_timer = nil;
} /**
* 下一个广告
*/
- (void)nextAdvert
{
CGFloat offset = _advertView.contentOffset.x + _width;
[_advertView setContentOffset:CGPointMake(offset, ) animated:YES];
} #pragma mark - UICollectionView的数据源和代理方法 - (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
return ;
} - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
//这里将数据放足够大,可以无限的轮播循环
return _advertData.count * ;
} - (AdvertCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
AdvertCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellIdentifier forIndexPath:indexPath];
cell.advert = _advertData[indexPath.item % ];
return cell;
} - (void)collectionView:(UICollectionView *)collectionView didEndDisplayingCell:(UICollectionViewCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath
{
//取出当前可见的单元格
NSIndexPath *visiablePath = [[collectionView indexPathsForVisibleItems] firstObject];
_pageControl.currentPage = visiablePath.item % ;
} #pragma mark 当拖拽时,暂时将定时器销毁
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
[self removeTimer];
}
#pragma mark 停止拖拽时,再次创建定时器
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
[self addTimer];
} @end

四、代码下载地址

https://github.com/wangzi9521/InfinitePicture

iOS项目开发之实现无限轮播的更多相关文章

  1. iOS开发UI篇—无限轮播(新闻数据展示)

    iOS开发UI篇—无限轮播(新闻数据展示) 一.实现效果        二.实现步骤 1.前期准备 (1)导入数据转模型的第三方框架MJExtension (2)向项目中添加保存有“新闻”数据的pli ...

  2. iOS开发UI篇—无限轮播(循环利用)

    iOS开发UI篇—无限轮播(循环利用) 一.无限轮播  1.简单说明 在开发中常需要对广告或者是一些图片进行自动的轮播,也就是所谓的无限滚动. 在开发的时候,我们通常的做法是使用一个UIScrollV ...

  3. iOS开发UI篇—无限轮播(循环展示)

    iOS开发UI篇—无限轮播(循环展示) 一.简单说明 之前的程序还存在一个问题,那就是不能循环展示,因为plist文件中只有五个数组,因此第一个和最后一个之后就没有了,下面介绍处理这种循环展示问题的小 ...

  4. iOS开发UI篇—无限轮播(功能完善)

    iOS开发UI篇—无限轮播(功能完善) 一.自动滚动 添加并设置一个定时器,每个2.0秒,就跳转到下一条. 获取当前正在展示的位置. [self addNSTimer]; } -(void)addNS ...

  5. iOS:实现图片的无限轮播(二)---之使用第三方库SDCycleScrollView

    iOS:实现图片的无限轮播(二)---之使用第三方库SDCycleScrollView 时间:2016-01-19 19:13:43      阅读:630      评论:0      收藏:0   ...

  6. iOS:实现图片的无限轮播---之使用第三方库SDCycleScrollView

    SDCycleScrollView API // //  SDCycleScrollView.h //  SDCycleScrollView #import <UIKit/UIKit.h> ...

  7. iOS:实现图片的无限轮播

    为尊重原创,特注明原文链接:http://m.myexception.cn/operating-system/1949043.html 图片轮播及其无限循环效果 平时APP中的广告位或者滚动的新闻图片 ...

  8. iOS:实现图片的无限轮播之使用第三方库SDCycleScrollView

    下载链接:github不断更新地址:https://github.com/gsdios/SDCycleScrollView #import "ViewController.h" # ...

  9. iOS开发之三个Button实现图片无限轮播(参考手机淘宝,Swift版)

    这两天使用Reveal工具查看"手机淘宝"App的UI层次时,发现其图片轮播使用了三个UIButton的复用来实现的图片循环无缝滚动.于是乎就有了今天这篇博客,看到“手机淘宝”这个 ...

随机推荐

  1. UVALIVE 2431 Binary Stirling Numbers

    转自别人的博客.这里记录一下 这题是定义如下的一个数: S(0, 0) = 1; S(n, 0) = 0 for n > 0;S(0, m) = 0 for m > 0; S(n, m) ...

  2. Nginx 兼容IE8

    前言 前段时间由于业务需要,在服务器上新增一个服务专门接收各个门店的业务结算数据,接口文档指明需要使用https协议.这本不是什么问题,因为之前服务器已经有配置过https.但等到服务部署之后才发现这 ...

  3. Laravel使用Eloquent ORM操作数据库

    1.定义模型 <?php namespace App; use Illuminate\Database\Eloquent\Model; class Flight extends Model{ p ...

  4. 系统封装的dispatch系列代码块引起的循环引用

    整整一天的时间都在找内存泄漏,唯独遗漏了这个代码块,结果就是它,希望大家以后注意. dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)( ...

  5. Codeforces 570D - Tree Requests(树上启发式合并)

    570D - Tree Requests 题意 给出一棵树,每个节点上有字母,查询 u k,问以 u 为根节点的子树下,深度为 k 的所有子节点上的字母经过任意排列是否能构成回文串. 分析 一个数组 ...

  6. luogu P1069 细胞分裂

    题目描述 Hanks 博士是 BT (Bio-Tech,生物技术) 领域的知名专家.现在,他正在为一个细胞实 验做准备工作:培养细胞样本. Hanks 博士手里现在有 N 种细胞,编号从 1~N,一个 ...

  7. 【bzoj2160】【啦啦队排练】manacher(马拉车)+差分+快速幂

    [pixiv] https://www.pixiv.net/member_illust.php?mode=medium&illust_id=34562780 向大(hei)佬(e)势力学(di ...

  8. db2字符串截取方法及常用函数

    select substr(index_code, 1, locate('-', index_code)-1) from report_data substr(str,m,n)表示从str中的m个字符 ...

  9. 使用PM2守护Nodejs命令行程序

    介绍 pm2是nodejs的一个带有负载均衡功能的应用进程管理器的模块,类似有Supervisor,forever,用来进行进程管理. 一.安装: <pre>npm install pm2 ...

  10. Cannot assign requested address 问题

    測试一个简单的TCP套接字程序,client向server请求建立连接然后释放. 在一台主机上同一时候执行两个client时.出现报错"Cannot assign requestedaddr ...