美文网首页
轮播模块

轮播模块

作者: HelloKing | 来源:发表于2016-10-17 11:22 被阅读37次

#import@interface LoopView : UIView

@property (nonatomic, assign) int imgCount;

@end

#import "LoopView.h"@interface LoopView ()@property (nonatomic, strong) NSTimer *timer;

@property (nonatomic)CGPoint offSet;

@property (nonatomic,strong)NSTimer *repeatingTimer;

@end

@implementation LoopView

- (void)awakeFromNib{

[super awakeFromNib];

UIScrollView *scrollView = [[UIScrollView alloc]init];

scrollView.showsHorizontalScrollIndicator = NO;

scrollView.pagingEnabled = YES;

scrollView.userInteractionEnabled = YES;

scrollView.delegate = self;

scrollView.tag = 100;

[self addSubview:scrollView];

UIImageView *currentImageView = [[UIImageView alloc]init];

currentImageView.image = [UIImage imageNamed:@"1"];

[scrollView addSubview:currentImageView];

currentImageView.tag = 102;

UIImageView *nextImageView = [[UIImageView alloc]init];

nextImageView.image = [UIImage imageNamed:@"2"];

[scrollView addSubview:nextImageView];

nextImageView.tag = 103;

UIImageView *preImageView = [[UIImageView alloc]init];

preImageView.image = [UIImage imageNamed:@"5"];

[scrollView addSubview:preImageView];

preImageView.tag = 101;

UIPageControl *pageControl = [[UIPageControl alloc]init];

pageControl.numberOfPages = 6;

pageControl.currentPage = 0;

pageControl.tag = 104;

[self addSubview:pageControl];

self.timer = [NSTimer scheduledTimerWithTimeInterval:5.0f target:self selector:@selector(update:) userInfo:nil repeats:YES];

[[NSRunLoop mainRunLoop] addTimer:self.timer forMode:NSRunLoopCommonModes];

NSInvocationOperation *peration = [[NSInvocationOperation alloc]initWithTarget:self selector:@selector(update:) object:nil];

NSOperationQueue *queue = [[NSOperationQueue alloc]init];

[queue addOperation:peration];

}

// 调整按钮的frame最好在这个方法里面

- (void)layoutSubviews

{

[super layoutSubviews];

UIPageControl *pageControl = [self viewWithTag:104];

UIScrollView *scrollview = [self viewWithTag:100];

UIImageView *currentImageView = [self viewWithTag:102];

UIImageView *preImageView = [self viewWithTag:101];

UIImageView *nextImageView = [self viewWithTag:103];

CGFloat width = self.frame.size.width;

CGFloat hight = self.frame.size.height;

scrollview.contentOffset = CGPointMake(width, 0);

scrollview.frame = CGRectMake(0, 0, width, hight);

[scrollview setContentSize:CGSizeMake(width * imgCount, hight)];

currentImageView.frame = CGRectMake(width, 0, width, hight);

nextImageView.frame = CGRectMake(width * 2, 0, width, hight);

preImageView.frame = CGRectMake(0, 0, width, hight);

pageControl.frame = CGRectMake(self.bounds.size.width/2 - 40, self.bounds.size.height - 100, 80, 20);

}

- (void)update:(NSTimer *)timer{

CGFloat width = self.frame.size.width;

_offSet = CGPointMake(width, 0);

NSTimer *timerSecond = [NSTimer scheduledTimerWithTimeInterval:0.002 target:self selector:@selector(updateImage) userInfo:nil repeats:YES];//0.002  更改图片速度

self.repeatingTimer = timerSecond;

}

- (void) updateImage{

UIScrollView *scrollview = [self viewWithTag:100];

_offSet.x += _offSet.x / 200;

[scrollview setContentOffset:_offSet animated:YES];

if (_offSet.x > self.frame.size.width * 2) {

[self.repeatingTimer invalidate];

self.repeatingTimer = nil;

}

}

#pragma mark -UISrollViewDelegate

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

[self.timer invalidate];

[self.repeatingTimer invalidate];

self.repeatingTimer = nil;

}

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

self.timer = [NSTimer scheduledTimerWithTimeInterval:5.0f target:self selector:@selector(update:) userInfo:nil repeats:YES];

[[NSRunLoop mainRunLoop] addTimer:self.timer forMode:NSRunLoopCommonModes];

}

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

UIScrollView *scrollview = [self viewWithTag:100];

UIImageView *currentImageView = [self viewWithTag:102];

UIImageView *preImageView = [self viewWithTag:101];

UIImageView *nextImageView = [self viewWithTag:103];

UIPageControl *pControl = (UIPageControl *)[self viewWithTag:104];

static int i = 1;

float offset = scrollview.contentOffset.x;

if (nextImageView.image == nil || preImageView.image == nil){

NSString *nextImgName = [NSString stringWithFormat:@"%d",i == imgCount ? 1 : i+1];

nextImageView.image = [UIImage imageNamed:nextImgName];

NSString *preImgName = [NSString stringWithFormat:@"%d", i == 1 ? imgCount : i-1];

preImageView.image = [UIImage imageNamed:preImgName];

}

if (offset == 0) {

currentImageView.image = preImageView.image;

scrollview.contentOffset = CGPointMake(scrollview.bounds.size.width,0);

preImageView.image = nil;

if (i == 1) {

i = imgCount;

pControl.currentPage = i - 1;

}else{

i = i - 1;

pControl.currentPage = i - 1;

}

}

if (offset == scrollview.bounds.size.width * 2) {

currentImageView.image = nextImageView.image;

scrollview.contentOffset = CGPointMake(scrollview.bounds.size.width, 0);

nextImageView.image = nil;

if (i == imgCount) {

i = 1;

pControl.currentPage = i - 1;

}else{

i += 1;

pControl.currentPage = i - 1;

}

}

}

@end

为什么用oc,swift2.3 到 3.0 改动较大,在Xcode7.3.1 和 Xcode8.0版本中改动较多。而此模块从网上下载下来就直接可以用。github连接 https://github.com/fanbo1101020133/Carousel-figure-Model 。

特点:1,自定义轮播图大小,拖View控件即可。在下图的class中加入LoopView。

2,无限轮播,任意多张图片,imgCount表示图片的个数。

3,可以改变轮播速度,文中已有标注。

相关文章

  • 轮播模块

    #import@interface LoopView : UIView @property (nonatomic,...

  • React轮播-----react-bootstrap

    React项目 使用轮播图 React-bootstrap中的轮播(Carousel)模块参考github: ht...

  • 门票碎片化改造(海玩首页)

    1.负责模块 宣传栏: 广告栏:多于一个配置时轮播展示,最多展示5个,小于1个时模块隐藏,轮播的小点调用AdSli...

  • 小程序的一些小坑

    美容美发营销小程序中轮播图模块,轮播图可关联文章链接或者跳转小程序,其中如果轮播图关联文章,并且文章选择h5模式(...

  • 2018-06-13

    2018.6.13 培训学习任务 - 根据设计交互稿完成轮播图功能- 模块规范化开发与样式编写 在支持左右滑入轮播...

  • 点击UITextFiled跳转的bug记录

    通过collectionView实现整个页面 顶部轮播banner通过contentInSet设置底部模块由col...

  • 内置模块之轮播

    1、基本使用 (1)导入layui.css文件和layui.js文件 (2)准备放轮播的容器(div)轮播一般...

  • android复杂首页布局

    示例图 分析:通过分析原型图,分为4个模块 1.轮播图2.公告3.指示器4.内容列表 实现:轮播图使用BGABan...

  • 女性美妆社交电商微信小程序精准获客的实现思路

    1, 基础功能:轮播、推荐模块等 一名用户在进入化妆品小程序的过程中,可以看到小程序主页基础的信息轮播功能以及产品...

  • 通用功能列表

    1.启动轮播2.启动图3.启动广告图消息推送定位版本更新登陆首页轮播图滚动标题用户模块用户反馈图片上传首页缓存

网友评论

      本文标题:轮播模块

      本文链接:https://www.haomeiwen.com/subject/hobnyttx.html