iOS开发

ScrollView+UIImageView 无限循环轮播

2017-06-21  本文已影响89人  逆风g

项目开发中经常遇到首页要用到Banner页轮播图片,基于性能和用户体验性考虑,使用ScrollView+UIImageView来实现,设计思想:用三个UIImageView来显示图片,中间的centerImageView显示当前索引下的图片,leftImageView显示前一张图片,rightImageView显示后一张图片。每当scrollView滑动停止时,重新设置三张ImageView的图片,并让scrollView显示中间额centerImageView。

公有方法

/*初始化*/
-(id)initWithFrame:(CGRect)frame withUrlArr:(NSArray *)urlArr  withTapBlock:(void(^)(NSInteger selectIndex)) block;
-(id)initWithFrame:(CGRect)frame withImgArr:(NSArray *)imgArr  withTapBlock:(void(^)(NSInteger selectIndex)) block;
/*动画*/
-(void)startAnimationWithInterval:(NSInteger)interval;
-(void)stopAnimation;

私有属性

{
    BOOL _isUrl;
}
@property(nonatomic,copy)void (^tapBlock)(NSInteger selectIndex);
@property(nonatomic,strong)UIScrollView     *scrollView;
@property(nonatomic,strong)UIPageControl    *pageControl;
@property(nonatomic,strong)NSTimer          *timer;
@property(nonatomic)NSInteger               currentImageIndex;
@property(nonatomic,strong)UIImageView      *leftImageView;
@property(nonatomic,strong)UIImageView      *centerImageView;
@property(nonatomic,strong)UIImageView      *rightImageView;
@property(nonatomic,copy)NSArray            *imgArr;
@property(nonatomic,copy)NSArray            *urlArr;

核心代码

-(void)reloadImage
{
    NSInteger leftImageIndex,rightImageIndex;
    CGPoint offset=[_scrollView contentOffset];
    if (offset.x>CGRectGetWidth(self.frame)) { //向右滑动
        _currentImageIndex=(_currentImageIndex+1)%self.pageControl.numberOfPages;
    }else if(offset.x<CGRectGetWidth(self.frame)){ //向左滑动
        _currentImageIndex=(_currentImageIndex+self.pageControl.numberOfPages-1)%self.pageControl.numberOfPages;
    }
    leftImageIndex=(_currentImageIndex+self.pageControl.numberOfPages-1)%self.pageControl.numberOfPages;
    rightImageIndex=(_currentImageIndex+1)%self.pageControl.numberOfPages;
    if(_isUrl)
    {
        [_centerImageView sd_setImageWithURL:[NSURL URLWithString:_urlArr[_currentImageIndex]]];
        [_leftImageView sd_setImageWithURL:[NSURL URLWithString:_urlArr[leftImageIndex]]];
        [_rightImageView sd_setImageWithURL:[NSURL URLWithString:_urlArr[rightImageIndex]]];
    }else
    {
        _centerImageView.image=_imgArr[_currentImageIndex];
        _leftImageView.image=_imgArr[leftImageIndex];
        _rightImageView.image=_imgArr[rightImageIndex];
    }
    _pageControl.currentPage=_currentImageIndex;
}

demo下载地址,这个demo可以拿来直接用

上一篇 下一篇

猜你喜欢

热点阅读