IOS轮播图
轮播图播放的主要技术在于:
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轮播图的更多相关文章
- 一步一步拆解一个简单的iOS轮播图(三图)
导言(可以不看): 不吹不黑,也许是东半球最简单的iOS轮播图拆分注释(讲解不敢当)了(tree new bee).(一句话包含两个人,你能猜到有谁吗?提示:一个在卖手机,一个最近在卖书)哈哈... ...
- iOS -- 轮播图
UIScrollView + 多张 ImageView 实现轮播 实现原理: 将所有图片的名字储存在数组 imageAry 中,imageAry 的元素个数为 num,在 scrollView 上添加 ...
- ReactNative新手学习之路04 组件化开发轮播图swiper支持安卓和IOS
react native 新手之路04 组件化开发轮播图swiper支持安卓和IOS npm install react-native-carousel --save git 地址Properties ...
- iOS 图片轮播图(自动滚动)
iOS 图片轮播图(自动滚动) #import "DDViewController.h" #define DDImageCount 5 @interface DDViewContr ...
- iOS回顾笔记(05) -- 手把手教你封装一个广告轮播图框架
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,bi ...
- iOS最笨的办法实现无限轮播图(网络加载)
iOS最笨的办法实现无限轮播图(网络加载) 简单的做了一下: 使用方法: 把 请求返回的 图片地址(字符串类型)放进数组中就行 可以使用SDWebImage(我就是用的这个)等..需要自己导入并引用, ...
- iOS开发之 用第三方类库实现轮播图
在github上面有很多的第三方类库,大大节约了大家的开发时间 下载地址:https://github.com/gsdios/SDCycleScrollView 现已支持cocoapods导入:pod ...
- iOS中 轮播图放哪最合适? 技术分享
我们知道,轮播图放在cell或collectionViewCell上会影响用户层级交互事件,并且实现起来比较麻烦,现在推出一个技术点:答题思路是:将UIScrollView放在UIView或UICol ...
- iOS swift版本无限滚动轮播图
之前写过oc版本的无限滚动轮播图,现在来一个swift版本全部使用snapKit布局,数字还是pageConrrol样式可选 enum typeStyle: Int { case pageContro ...
随机推荐
- [开源]用MQL4实现MD5加密
本文转载自博客园:混沌的世界 原文地址:http://www.cnblogs.com/niniwzw/archive/2009/12/05/1617685.html 在用MQL4进行金融交易的时候,经 ...
- 2016 Multi-University Training Contest 1 J.Subway
Subway Time Limit: 7000/3500 MS (Java/Others) Memory Limit: 262144/262144 K (Java/Others)Total Su ...
- 《Invert》开发日志04:工具、资源和服务
这篇记录一下<Invert>用到的工具.资源和服务.秉承两个原则:一,绝不侵犯版权:二,尽量节省开支. 首先是工具.游戏引擎使用免费的Unity个人版: 编码IDE使用免费的VisualS ...
- 【Oracle】ora-28001 ora-28002提示用户密码即将过期的解决办法
-- 1.首先查看用户的配置文件中的用户密码生命周期,一般情况下默认是180天.登录时系统提示ora-28002该用户即将过期 -- 可以先查看一下各用户的状态 SELECT username,PRO ...
- Django分析之如何自定义manage命令
我们都用过Django的manage.py的命令,而manage.py是在我们创建Django项目的时候就自动生成在根目录下的一个命令行工具,它可以执行一些简单的命令,其功能是将Django proj ...
- react-native 之布局篇
一.宽度单位和像素密度 react的宽度不支持百分比,设置宽度时不需要带单位,那么默认的单位是什么呢? /** * Sample React Native App * https://github.c ...
- ArrayList 实现删除重复元素(元素为对象类型)
package 集合; import java.util.ArrayList;import java.util.Iterator; /* * 删除集合中的重复的元素(元素是对象形式的) * * Li ...
- Ajax校验
一.Ajax简介 AJAX即(Asynchronous JavaScript and Xml)(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术. Ajax的关键元素包括以 ...
- js模版引擎handlebars.js实用教程——为什么选择Handlebars.js
返回目录 据小菜了解,对于java开发,涉及到页面展示时,比较主流的有两种解决方案: 1. struts2+vo+el表达式. 这种方式,重点不在于struts2,而是vo和el表达式,其基本思想是: ...
- jsp页面中jstl标签详解
JSLT标签库,是日常开发经常使用的,也是众多标签中性能最好的.把常用的内容,放在这里备份一份,随用随查.尽量做到不用查,就可以随手就可以写出来.这算是Java程序员的基本功吧,一定要扎实. JSTL ...