封装广告轮播图

效果图:
轮播图.jpg

由于录制的视频是mov格式,真不知道该怎么转换成GIF的,所以,就随便贴一张静态图来吧~

开始做之前百度了一下,有好几种方法来做这个,但是我这个要求是要用三个ImageView套在ScrollView里面实现复用,所以就用这种办法来做的

由于要有封装性,所以新建一个Carousel的类,继承与UIView。
Carousel.h

//
//  Carousel.h
//  广告轮播
//
//  Created by  刘雅兰 on 2017/11/28.
//  Copyright © 2017年  刘雅兰. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface Carousel : UIView
@property (strong,nonatomic) NSArray *images;//图片
@property (assign,nonatomic) NSTimeInterval timeInterval;//时间

@end

Carousel.m

//
//  Carousel.m
//  广告轮播
//
//  Created by  刘雅兰 on 2017/11/28.
//  Copyright © 2017年  刘雅兰. All rights reserved.
//

#import "Carousel.h"

#define SCREEN_WIDTH    ([[UIScreen mainScreen] bounds].size.width)



@interface Carousel()<UIScrollViewDelegate>

@property (strong,nonatomic) UIScrollView *scrollView;
@property (strong,nonatomic) UIPageControl *pageControl;

@property (assign,nonatomic) NSTimer *timer;//定时器
@property (assign,nonatomic) NSInteger currentPage;

@property (strong,nonatomic) UIImageView *leftImageView;
@property (strong,nonatomic) UIImageView *middleImageView;
@property (strong,nonatomic) UIImageView *rightImageView;

@property (strong ,nonatomic) NSMutableArray *arrayView;





@end


@implementation Carousel

-(instancetype)initWithFrame:(CGRect)frame{
    self = [super initWithFrame:frame];
    if (self) {
        _currentPage = 0;
    
        [self createUI];
    }
    return self;
}
-(void)createUI{
    _scrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 220)];
    _scrollView.showsHorizontalScrollIndicator = NO;
    _scrollView.showsVerticalScrollIndicator = NO;
    _scrollView.pagingEnabled = YES;
    _scrollView.scrollEnabled = YES;
    _scrollView.bounces = 0;
    [self addSubview:_scrollView];
    
//    _leftImageView = [[UIImageView alloc]initWithFrame:CGRectMake(SCREEN_WIDTH * 0, 0, SCREEN_WIDTH, 220)];
//    _leftImageView.userInteractionEnabled = YES;
//    [_scrollView addSubview:_leftImageView];
//
//    _middleImageView = [[UIImageView alloc]initWithFrame:CGRectMake(SCREEN_WIDTH * 1, 0, SCREEN_WIDTH, 220)];
//    _middleImageView.userInteractionEnabled = YES;
//    [_scrollView addSubview:_middleImageView];
//
//    _rightImageView = [[UIImageView alloc]initWithFrame:CGRectMake(SCREEN_WIDTH * 2, 0, SCREEN_WIDTH, 220)];
//    _rightImageView.userInteractionEnabled = YES;
//    [_scrollView addSubview:_rightImageView];
    
    NSInteger imgViewCounts = 3;
    _scrollView.contentSize = CGSizeMake(imgViewCounts *SCREEN_WIDTH, 220);
    for (NSInteger i = 0; i < imgViewCounts; i++) {
        UIImageView *imgView = [UIImageView new];
        imgView.frame = CGRectMake(SCREEN_WIDTH *i, 0, SCREEN_WIDTH, 220);
        [_scrollView addSubview:imgView];
        if (i == 0){
            _leftImageView = imgView;
        }
        if (i == 1) {
            _middleImageView = imgView;
        }
        if (i == 2) {
            _rightImageView = imgView;
        }
    }
    _scrollView.contentOffset = CGPointMake(SCREEN_WIDTH, 0);

    
    _pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(0, 200, SCREEN_WIDTH, 20)];

    _pageControl.currentPageIndicatorTintColor = [UIColor blackColor];
    _pageControl.pageIndicatorTintColor = [UIColor whiteColor];

    [self addSubview:_pageControl];
    
    // 显示中间的视图
//    _scrollView.contentOffset = CGPointMake(SCREEN_WIDTH, 0);
    _scrollView.delegate = self;
    
    // 开始是第一张图片
    _currentPage = 0;
//    _leftImageView.backgroundColor = [UIColor redColor];
//    _middleImageView.backgroundColor = [UIColor yellowColor];
//    _rightImageView.backgroundColor = [UIColor blueColor];


    
//    _leftImageView.image = [UIImage imageNamed:_images[_images.count - 1]];
//    _middleImageView.image = [UIImage imageNamed:_images[_currentPage]];
//    _rightImageView.image = [UIImage imageNamed:_images[_currentPage + 1]];
    
    
    _arrayView = [NSMutableArray arrayWithCapacity:3];
    [_arrayView addObject:_leftImageView];
    [_arrayView addObject:_middleImageView];
    [_arrayView addObject:_rightImageView];
    
}

//滚动
-(void)scrollViewDidScroll:(UIScrollView *)scrollView {
//    [self stopTimer];
    [self checkOffset];
//    [self stopTimer];

}
-(void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView{
//    [self autoScroll];
    
}

-(void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{
//    [self autoScroll];
    
}
//  每次向左滑动到rightImageView,且滑动结束后把middleImageView的图片更新为rightImageView一样的图片,rightImageView更新为nextIMG,且scrollView.contentOffset强制调整为middleImageView.frame.x,最后更新leftImageView

//  每次向右滑动到leftImageView,且滑动结束后把middleImageView的图片更新为leftImageView一样的图片,leftImageView更新为lastIMG,且scrollView.contentOffset强制调整为middleImageView.frame.x,最后更新rightImageView

/*
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
    CGFloat currentX = scrollView.contentOffset.x;
    NSLog(@"scrollViewDidEndDecelerating%.2f",currentX);
    if (currentX == 0) {
        id obj = _arrayView.lastObject;
        [_arrayView removeLastObject];
        [_arrayView insertObject:obj atIndex:0];
        int i = 0;
        for (UIImageView *imgView in _arrayView) {

            imgView.frame = CGRectMake(i * SCREEN_WIDTH, 0, SCREEN_WIDTH, 220);
            i++;
        }
        [_scrollView setContentOffset:CGPointMake(SCREEN_WIDTH, 0)];
        
        
        
    } else if (currentX == 2 * SCREEN_WIDTH) {
        id obj = _arrayView.firstObject;
        [_arrayView removeObjectAtIndex:0];
        [_arrayView insertObject:obj atIndex:_arrayView.count];

        int i = 0;
        for (UIImageView *imgView in _arrayView) {
            imgView.frame = CGRectMake(i * SCREEN_WIDTH, 0, SCREEN_WIDTH, 220);
            i++;
        }
        [_scrollView setContentOffset:CGPointMake(SCREEN_WIDTH, 0)];

    }



}
*/
-(void)checkOffset {
    
    // 左
    if (_scrollView.contentOffset.x <= 0) {
        _middleImageView.image = _leftImageView.image;
        _scrollView.contentOffset = CGPointMake(SCREEN_WIDTH, 0);
        _currentPage--;
        [self refreshIMG];
    }
    // 右
    else if (_scrollView.contentOffset.x >= SCREEN_WIDTH *2) {
        _middleImageView.image = _rightImageView.image;
        _scrollView.contentOffset = CGPointMake(SCREEN_WIDTH, 0);
        _currentPage++;
        [self refreshIMG];
    }
}
- (void)refreshIMG {
  
    if (_currentPage < 0) {
        _currentPage = _images.count-1;
    }
    else if (_currentPage >= _images.count) {
        _currentPage = 0;
    }
    
    
    //  middleImageView的img为01.jpg的时候,leftImageView应显示06.img
    NSInteger leftIndex;
    if (_currentPage == 0) {
        
        leftIndex=_images.count-1;
    
    }else{
        
        leftIndex=_currentPage-1;
    }
    
    NSInteger rightIndex;
    if (_currentPage+1 == _images.count) {
        rightIndex = 0;
        
    }else{
        rightIndex = _currentPage +1;
    }
    
    // 左
    _leftImageView.image = [UIImage imageNamed:_images[leftIndex]];
    // 中
    _middleImageView.image = [UIImage imageNamed:_images[_currentPage]];
    // 右
    _rightImageView.image = [UIImage imageNamed:_images[rightIndex]];
    // 小点
    _pageControl.currentPage = _currentPage;
}




#pragma mark setter
- (void)setImages:(NSArray *)images {
    
        _images = images;
        _pageControl.numberOfPages = images.count;
        [self refreshIMG];
//        [self beginTimer];
//        [self autoScroll];

}
- (void)setTimeInterval:(NSTimeInterval)timeInterval {
    
    _timeInterval = timeInterval;
    //    return;
    [self autoScroll];
}

- (void)autoScroll {
    if (!_timer) {
       _timer= [NSTimer scheduledTimerWithTimeInterval:_timeInterval target:self selector:@selector(sad) userInfo:nil repeats:YES];
        [[NSRunLoop mainRunLoop]addTimer:_timer forMode:NSDefaultRunLoopMode];
    }
}
- (void)sad {
    NSLog(@"haha");
    CGPoint offset = CGPointMake(SCREEN_WIDTH *2, 0);
    [_scrollView setContentOffset:offset animated:YES];
}


- (void)stopTimer {
    
    
    [_timer invalidate];
    _timer = nil;
    
    
}

/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
}
*/

@end

可以看到我注释了一大堆,纠结好这个不容易啊!!!还求助了各种大神!

接下来,在ViewController里面使用了

ViewController.m

//
//  ViewController.m
//  广告轮播
//
//  Created by  刘雅兰 on 2017/11/28.
//  Copyright © 2017年  刘雅兰. All rights reserved.
//

#import "ViewController.h"
#import "Carousel.h"

@interface ViewController ()<UIScrollViewDelegate>



@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    UIView *viewUp = [[UIView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 64)];
    UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(146, 44, 100, 20)];
    label.text = @"BLACKPINK";
    [viewUp addSubview:label];
    [self.view addSubview:viewUp];
    
  
    NSArray *images = @[@"01.jpg",@"02.jpg",@"03.jpg",@"04.jpg",@"05.jpg",@"06.jpg"];
    
    Carousel *carousel = [[Carousel alloc] initWithFrame:CGRectMake(0, 100, self.view.frame.size.width, 220)];
    carousel.images = images;
    carousel.timeInterval = 2.0;
    [self.view addSubview:carousel];

    // Do any additional setup after loading the view from its nib.
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

/*
#pragma mark - Navigation

// In a storyboard-based application, you will often want to do a little preparation before navigation
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
    // Get the new view controller using [segue destinationViewController].
    // Pass the selected object to the new view controller.
}
*/

@end

ok呐,就酱紫,折磨了我三天!
demo链接:https://gitee.com/LanXiaoMei/FengZhuangGuangGaoLunBoTu/tree/master

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,839评论 6 482
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,543评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 153,116评论 0 344
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,371评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,384评论 5 374
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,111评论 1 285
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,416评论 3 400
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,053评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,558评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,007评论 2 325
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,117评论 1 334
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,756评论 4 324
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,324评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,315评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,539评论 1 262
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,578评论 2 355
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,877评论 2 345

推荐阅读更多精彩内容

  • Gif 图效果如图所示: 我所用的 Gif 图工具是 "licecap"大家可以上百度查询,有下载地址 知道你们懒...
    小苗晓雪阅读 417评论 0 2
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,029评论 4 62
  • Documentation Supported OS & SDK Versions 支持的OS & SDK版本 S...
    c5550ea746f8阅读 4,322评论 0 2
  • 【从本文章中我学到的最重要的概念】我们要懂 得充分挖掘并发挥自己的潜能 【我在本文章中学到的怦然心动的单词】 re...
    145武鹏梅阅读 205评论 2 0
  • 虽然这本书曾经被"快乐大本营"里宣传过,但是今日,我还是忍不住要向大家介绍起这本书来,因为它使我久久不能忘怀。 本...
    喂歪阅读 583评论 0 2