封装广告轮播图

效果图:
封装广告轮播图_第1张图片
轮播图.jpg

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

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

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

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

#import 

@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()

@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 ()



@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

你可能感兴趣的:(封装广告轮播图)