轮播图播放的主要技术在于:

cell的封装。这里采用UICollectionViewCell实现。

#import <UIKit/UIKit.h>

@interface CircleViewCell : UICollectionViewCell

@property (nonatomic, strong) UIImage* image;

@property (nonatomic, assign) NSInteger index;

@end

//

//  CircleViewCell.m

//  lunbo

//

//  Created by  JIAOXIANGJIE on 16/10/12.

//  Copyright © 2016年 lumen. All rights reserved.

//

#import "CircleViewCell.h"

@interface CircleViewCell()

@property (nonatomic, strong) UIImageView* imageview;

@end

@implementation CircleViewCell

-(instancetype)init{

if(self = [super init]){

[self myInit];

}

return self;

}

-(instancetype)initWithCoder:(NSCoder *)aDecoder

{

if(self = [super initWithCoder:aDecoder])

[self myInit];

return self;

}

-(instancetype)initWithFrame:(CGRect)frame

{

if(self = [super initWithFrame:frame])

[self myInit];

return self;

}

-(void)layoutSubviews

{

[super layoutSubviews];

self.imageview.frame = self.contentView.bounds;

}

-(UIImageView*)imageview

{

if(_imageview == nil){

_imageview = [[UIImageView alloc] init];

_imageview.contentMode = UIViewContentModeScaleAspectFill;

_imageview.userInteractionEnabled = YES;

_imageview.backgroundColor = [UIColor whiteColor];

}

return _imageview;

}

-(void)setImage:(UIImage *)image

{

_image = image;

self.imageview.image = image;

}

//

//  CircleScrollView.h

//  lunbo

//

//  Created by  JIAOXIANGJIE on 16/10/12.

//  Copyright © 2016年 lumen. All rights reserved.

//

#import <UIKit/UIKit.h>

@class CircleScrollView;

@protocol CircleScrollViewDelegate <NSObject>

- (void)didClickImageAtIndex:(NSInteger)index scrollView:(CircleScrollView *)scrollView;

@end

@interface CircleScrollView : UIView

@property (nonatomic, weak) id<CircleScrollViewDelegate> delegate;//设置代理

@property (nonatomic, assign) NSTimeInterval duringTimel;//间隔时间

-(void)images:(NSArray*)images;

-(void)closeTimer;

-(void)openTimer;

@end

-(void)myInit{

[self.contentView addSubview:self.imageview];

}

@end

//

//  CircleScrollView.m

//  lunbo

//

//  Created by  JIAOXIANGJIE on 16/10/12.

//  Copyright © 2016年 lumen. All rights reserved.

//

#import "CircleScrollView.h"

#import "CircleViewCell.h"

@interface CircleScrollView()<UICollectionViewDataSource,UICollectionViewDelegate>

@property (nonatomic, strong) UICollectionView* collectionView;

@property (nonatomic, strong) NSArray* images;//图片数组

@property (nonatomic, assign) NSInteger imagecount;//图片数量

@property (nonatomic, strong) NSMutableArray* cellData;//数组

@property (nonatomic, strong) UIPageControl* pageControl;

@property (nonatomic, strong) NSTimer* timer;

@property (nonatomic, strong) NSLock* mlock;//加锁 用于多线程

@end

@implementation CircleScrollView

static NSString *CollectionCellID = @"CollectionCellID";

-(instancetype)initWithFrame:(CGRect)frame

{

if(self = [super initWithFrame:frame]){

//初始化数据信息

UICollectionViewFlowLayout* flowLayout = [[UICollectionViewFlowLayout alloc] init];

flowLayout.itemSize = frame.size;

flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal;

flowLayout.minimumLineSpacing = 0;

flowLayout.minimumInteritemSpacing = 0;

flowLayout.sectionInset = UIEdgeInsetsMake(0, 0, 0, 0);

self.collectionView = [[UICollectionView alloc] initWithFrame:self.bounds

collectionViewLayout:flowLayout];

self.collectionView.delegate = self;

self.collectionView.dataSource = self;

self.collectionView.pagingEnabled = YES;

self.collectionView.showsHorizontalScrollIndicator = NO;

self.collectionView.showsVerticalScrollIndicator = NO;

self.collectionView.alwaysBounceHorizontal = YES;

self.collectionView.alwaysBounceVertical = NO;

self.collectionView.backgroundColor = [UIColor whiteColor];

[self.collectionView registerClass:[CircleViewCell class]

forCellWithReuseIdentifier:CollectionCellID];

[self addSubview:self.collectionView];

self.pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake( 0, self.bounds.size.height - 30, self.bounds.size.width, 30)];

self.pageControl.tag = 100;

self.pageControl.userInteractionEnabled = NO;

[self addSubview:self.pageControl];

[self bringSubviewToFront:self.pageControl];

self.backgroundColor = [UIColor whiteColor];

self.mlock = [[NSLock alloc] init];

}

return self;

}

-(void)setDuringTimel:(NSTimeInterval)duringTimel

{

_duringTimel = duringTimel;

if(duringTimel < 0.001)

return;

[self closeTimer];

[self openTimer];

}

-(void)images:(NSArray*)images

{

[self.mlock lock];

[self closeTimer];

_images = images;

_imagecount = images.count;

self.cellData = [[NSMutableArray alloc] init];

for(NSInteger i = 0; i < 100; i++){

for (NSInteger j = 0; j < _imagecount; j++) {

[self.cellData addObject:@(j)];

}

}

[self.collectionView reloadData];

[self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForRow:50 * _imagecount inSection:0]

atScrollPosition:UICollectionViewScrollPositionLeft

animated:NO];

//设置

self.pageControl.hidden = _imagecount > 0 ? NO: YES;

self.pageControl.numberOfPages = _imagecount;

self.pageControl.currentPage = 0;

[self openTimer];

[self.mlock unlock];

}

-(void)closeTimer

{

if(self.timer)

[self.timer invalidate];

}

-(void)openTimer

{

if(_duringTimel > 0.8)

self.timer = [NSTimer scheduledTimerWithTimeInterval:_duringTimel

target:self

selector:@selector(onTimer)

userInfo:nil

repeats:YES];

}

-(void)onTimer

{

if(self.cellData.count > 0){

NSArray* array = [self.collectionView indexPathsForVisibleItems];

if(array.count == 0)

return;

NSIndexPath* indexPath = array[0];

NSInteger row = indexPath.row;

if(row % _imagecount == 0){

row = 50 * _imagecount;

[self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForRow:row inSection:0] atScrollPosition:UICollectionViewScrollPositionLeft animated:NO];

}

[self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForRow:row + 1 inSection:0] atScrollPosition:UICollectionViewScrollPositionLeft animated:YES];

self.pageControl.currentPage = (row + 1) % _imagecount;

}

}

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {

return 1;

}

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {

return self.cellData.count;

}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath

{

CircleViewCell* cell = [collectionView dequeueReusableCellWithReuseIdentifier:CollectionCellID forIndexPath:indexPath];

NSInteger index = [_cellData[indexPath.row] integerValue];

cell.image = _images[index];

cell.index = index;

return cell;

}

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {

// 动画停止, 重新定位到第 50 组模型

int inc = ((int)(scrollView.contentOffset.x / scrollView.frame.size.width)) % _imagecount;

[self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForRow:50 * _imagecount + inc inSection:0] atScrollPosition:UICollectionViewScrollPositionLeft animated:NO];

// 设置 PageControl

self.pageControl.currentPage = inc;

}

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {

CircleViewCell *cell = (CircleViewCell *)[collectionView cellForItemAtIndexPath:indexPath];

if ([self.delegate respondsToSelector:@selector(didClickImageAtIndex:scrollView:)]) {

[self.delegate didClickImageAtIndex:cell.index scrollView:self];

}

}

@end

//

//  ViewController.m

//  lunbo

//

//  Created by  JIAOXIANGJIE on 16/10/12.

//  Copyright © 2016年 lumen. All rights reserved.

//

#import "ViewController.h"

#import "CircleScrollView.h"

@interface ViewController ()<CircleScrollViewDelegate>

@end

@implementation ViewController

- (void)viewDidLoad {

[super viewDidLoad];

self.view.backgroundColor = [UIColor lightGrayColor];

CGSize size = [UIScreen mainScreen].bounds.size;

CircleScrollView* scrollview = [[CircleScrollView alloc] initWithFrame:CGRectMake(0, 20, size.width, size.width * 504 / 1080)];

scrollview.delegate = self;

[scrollview images:@[[UIImage imageNamed:@"photo_loading"]]];      // 占位图

[self.view addSubview:scrollview];

UIImage *m1 = [UIImage imageNamed:@"m1.jpg"];

UIImage *m2 = [UIImage imageNamed:@"m2.jpg"];

UIImage *m3 = [UIImage imageNamed:@"m3.jpg"];

UIImage *m4 = [UIImage imageNamed:@"m4.jpg"];

UIImage *m5 = [UIImage imageNamed:@"m5.jpg"];

CircleScrollView* scroll1 = [[CircleScrollView alloc] initWithFrame:CGRectMake(0, 220, size.width, size.width * 504 / 1080)];

scroll1.delegate = self;

scroll1.duringTimel = 1.0;

[scroll1 images:@[m1,m2]];

CircleScrollView* view = [[CircleScrollView alloc] initWithFrame:CGRectMake( 0, 420, size.width, size.width * 504 / 1080)];

view.delegate = self;

[view images:@[m1, m2, m3, m4, m5]];

[self.view addSubview:view];

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

}

- (void)didClickImageAtIndex:(NSInteger)index scrollView:(CircleScrollView *)scrollView {

NSLog(@"%li", index);

}

@end

效果图:

IOS轮播图的更多相关文章

  1. 一步一步拆解一个简单的iOS轮播图(三图)

    导言(可以不看): 不吹不黑,也许是东半球最简单的iOS轮播图拆分注释(讲解不敢当)了(tree new bee).(一句话包含两个人,你能猜到有谁吗?提示:一个在卖手机,一个最近在卖书)哈哈... ...

  2. iOS -- 轮播图

    UIScrollView + 多张 ImageView 实现轮播 实现原理: 将所有图片的名字储存在数组 imageAry 中,imageAry 的元素个数为 num,在 scrollView 上添加 ...

  3. ReactNative新手学习之路04 组件化开发轮播图swiper支持安卓和IOS

    react native 新手之路04 组件化开发轮播图swiper支持安卓和IOS npm install react-native-carousel --save git 地址Properties ...

  4. iOS 图片轮播图(自动滚动)

    iOS 图片轮播图(自动滚动) #import "DDViewController.h" #define DDImageCount 5 @interface DDViewContr ...

  5. iOS回顾笔记(05) -- 手把手教你封装一个广告轮播图框架

    html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,bi ...

  6. iOS最笨的办法实现无限轮播图(网络加载)

    iOS最笨的办法实现无限轮播图(网络加载) 简单的做了一下: 使用方法: 把 请求返回的 图片地址(字符串类型)放进数组中就行 可以使用SDWebImage(我就是用的这个)等..需要自己导入并引用, ...

  7. iOS开发之 用第三方类库实现轮播图

    在github上面有很多的第三方类库,大大节约了大家的开发时间 下载地址:https://github.com/gsdios/SDCycleScrollView 现已支持cocoapods导入:pod ...

  8. iOS中 轮播图放哪最合适? 技术分享

    我们知道,轮播图放在cell或collectionViewCell上会影响用户层级交互事件,并且实现起来比较麻烦,现在推出一个技术点:答题思路是:将UIScrollView放在UIView或UICol ...

  9. iOS swift版本无限滚动轮播图

    之前写过oc版本的无限滚动轮播图,现在来一个swift版本全部使用snapKit布局,数字还是pageConrrol样式可选 enum typeStyle: Int { case pageContro ...

随机推荐

  1. java-集合3

    浏览以下内容前,请点击并阅读 声明 Queue接口(队列) 需要对一些列的元素进行处理前,我们可以把他们放到Queue对象中,除了继承Collection接口的方法外,队列还有一些插入,删除和检查操作 ...

  2. JBD日志的定位、分析和恢复

    在上一篇中,我们介绍了Ext3文件系统的日志可以看做一个文件,由JBD进行管理.自然而然引出如下这些问题: 1)如何定位ext3日志文件和查看日志文件的裸数据? 2)ext3日志文件数据在物理上是如何 ...

  3. 修复VS,恢复初始状态

    命令提示 输入命令: devenv.exe /resetuserdata 处理版本221优化改动:1.SQL优化,采用预编译方式并将SQL语句修改为大写,尽量减少Oracle数据库硬解析2.复用部分代 ...

  4. java Properties 配置信息类

    Properties(配置信息类):主要用于生产配置文件和读取配置文件信息. ----> 是一个集合类 继承HashTable 存值是以键-值的方式. package com.beiwo.io; ...

  5. xampp安装

    软件下载在以下网站 http://www.apachefriends.org/zh_cn/index.html XAMPP 是一个易于安装且包含 MySQL.PHP 和 Perl 的 Apache 发 ...

  6. centos7 最小化安装没有ifconfig及修改网卡名enoxxx为ethX

    问题: 1.最小化安装centos7后发现无ifconfig命令 想通过ifconfig查看ip地址发现ifconfig命令不存在,可通过命令 #ip addr       //查看ip 或者 解决: ...

  7. CSS Sprites+CSS3 Icon Font

    CSS Sprites+CSS3 Icon Font CSS Sprites在国内很多人叫CSS精灵,是一种网页图片应用处理方式.它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来, ...

  8. redis批量删除key

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #000000; background-color: #fffff ...

  9. 在SQL语句中加入时间比较作为查询条件

    select * from 表名 where 列名 = ? and DATEDIFF(hh,时间列,'2016-08-22 15:05:59.000')<9

  10. 自定义组件-IPEdit

    输入IP用的.....支持windows风格显示 unit HSIPEdit; // ********************************************************* ...