简易轮播图的封装

现今很多项目中都有轮播图的这个功能，这两天我们的项目中也处处要用到轮播图，所以我写了一个简易的轮播图封装，轻松的解决了所遇到的问题。

由于我这个轮播图传入的参数是存放图片URL的数组，所以在用的时候需先引入SDWebImage的第三方，当然，用我上一篇写的图片下载的两种方法也可行。

//WheelImageTool.h中的代码

@interface WheelImageTool : UIView
//引出一个外部可以调用的方法
//用这个方法初始化  1.frame    2.存放图片url字符串的数组   3.轮播时间间隔
- (instancetype )initWithFrame:(CGRect)frame imageUrlArr:(NSArray *)arr timeInterval:(CGFloat)timeInterval;
@end

//WheelImageTool.m中的代码

#import "WheelImageTool.h"
#import "UIImageView+WebCache.h"
@interface WheelImageTool()<UIScrollViewDelegate>
{
    NSUInteger count;//记录图片个数
    NSUInteger currentNum;//记录当前播放图片的序号
}
@property (nonatomic,strong)UIScrollView *mainScroller;
@property (nonatomic,strong)UIPageControl *page;
//虽然用计时器不准确，但谁又会无聊到去计算轮播图的时间间隔和自己传入的时间间隔是否一致
@property (nonatomic,strong)NSTimer *timer;
//轮播图片之间的间隔
@property (nonatomic,assign)CGFloat timeInterval;
@end

@implementation WheelImageTool

//1.frame     2.存放图片url字符串的数组   3.轮播时间间隔
- (instancetype )initWithFrame:(CGRect)frame imageUrlArr:(NSArray *)arr timeInterval:(CGFloat)timeInterval
{
    self = [super initWithFrame:frame];
    if (self) {
        // 保存一下输入的时间间隔
        self.timeInterval = timeInterval;
        //记录传入的图片总数
        count = arr.count;
        //给当前图片设置一个初值：即为传入图片的第一张（本应是0，但轮播图片整体前后各自加了一张图片，所以为1）
        currentNum = 1;
        //传入图片数组不为空时，程序继续运行
        if (arr.count != 0)
        {
             //私有方法
            [self setViewWithImageUrlArr:arr];
            if(timeInterval )
            {//传入时间间隔不为空，则开始计时
            [self.timer invalidate];
                self.timer = nil;
        self.timer = [NSTimer scheduledTimerWithTimeInterval:timeInterval target:self selector:@selector(timerAction) userInfo:nil repeats:YES];
            }
        }
    }
    return self;
}
//定时器的方法
- (void)timerAction{
 if (count == 1) {
 //如果数组只有一张图片，则没有轮播的效果
        [self.mainScroller setContentOffset:CGPointMake(0, 0) animated:NO];
    }else{
    //如果数组有多张图片，则有轮播的效果
//每次进来先得到即将播放图片的序号
    currentNum ++;
    //如果即将播放图片的最后一张
    if (currentNum == count+1)
    {
        //播放到最后一张时
        //先将，小圆点对应到0
        self.page.currentPage = 0;
        //无动画直接跳转到第一张（这样避免了往回图片回播的动画，达到一直往右边轮播的效果）
        [self.mainScroller setContentOffset:CGPointMake(0, 0) animated:NO];
        //无时间有动画跳转到第二张
        [self.mainScroller setContentOffset:CGPointMake(self.frame.size.width, 0) animated:YES];
        //将正在播放的图片序号返回初始状态
        currentNum = 1;
        return; 
    }
    //根据即将播放的图片的序号设置UIScrollerView的偏移量
    [self.mainScroller setContentOffset:CGPointMake(currentNum *self.frame.size.width, 0) animated:YES];
    //page 的点跟随偏移量改变
    self.page.currentPage = currentNum - 1;
    }
}
#pragma mark -scroll的代理方法 ==== 结束减速时的操作
//作用：在自动轮播时，手动滑动图片不会影响轮播的功能
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
    //根据偏移量来计算显示的是第几张图片，从而改变page
    currentNum = self.mainScroller.contentOffset.x / self.frame.size.width;
    if (currentNum == count + 1) {
        //滑动图片到最后一张时，直接跳到第二张。
        self.page.currentPage = 0 ;
        currentNum = 1;
        [self.mainScroller setContentOffset:CGPointMake(currentNum * self.frame.size.width, 0) animated:NO];
    }else{
        self.page.currentPage = currentNum - 1 ;
    }
}
//私有方法
- (void)setViewWithImageUrlArr:(NSArray *)arr{
    //设置mainScroller
    self.mainScroller = [[UIScrollView alloc]initWithFrame:self.frame];
    self.mainScroller.contentSize = CGSizeMake((arr.count+2)*self.frame.size.width, 0);
    self.mainScroller.delegate = self;
    //整页滑动
    self.mainScroller.pagingEnabled = YES;
    //关闭反弹效果
    self.mainScroller.bounces = NO;
    //不显示滚动条
  self.mainScroller.showsHorizontalScrollIndicator = NO;
    //初始偏移量为传入的第一张图（轮播图组的第二张）
    self.mainScroller.contentOffset = CGPointMake(self.frame.size.width, 0);
    [self addSubview:self.mainScroller];

    //将所有图片排好顺序（总共n+2张，第一张加在最后一张，最后一张加载第一张）
    //第一张
    UIImageView *imV1 = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
    imV1.userInteractionEnabled = YES;
    [imV1 sd_setImageWithURL:arr.lastObject];
    [self.mainScroller addSubview:imV1];
    //按顺序加入数组中的图片
    for (int i = 0 ; i < arr.count ; i++) {
        UIImageView *imV = [[UIImageView alloc]initWithFrame:CGRectMake(self.frame.size.width * (i+1), 0, self.frame.size.width, self.frame.size.height)];
        imV.userInteractionEnabled = YES;
        [imV sd_setImageWithURL:arr[i]];
        [self.mainScroller addSubview:imV];
    }
    //最后一张
    UIImageView *imV2 = [[UIImageView alloc]initWithFrame:CGRectMake(self.frame.size.width * ( arr.count + 1 ), 0, self.frame.size.width, self.frame.size.height)];
    imV2.userInteractionEnabled = YES;
    [imV2 sd_setImageWithURL:arr.firstObject];
    [self.mainScroller addSubview:imV2];
    //设置一下pageControl:设置在右下角
    self.page = [[UIPageControl alloc]initWithFrame:CGRectMake(self.frame.size.width - 80, self.frame.size.height - 30, 80, 30)];
    self.page.enabled = NO;//不可点击
    self.page.numberOfPages = arr.count;
    [self addSubview:self.page];
}
@end

实验结果是没有问题的，由于轮播图片的结果是动态的，我暂时还不知道怎么展示出来，所以没在此处给大家展示，但是这个一定是可以用的，代码为个人所写，有任何不足或可以改良之处望大家提出，谢谢。