思路
為了實現(xiàn)廣告輪播頁首尾無縫銜接舒裤，我們要在創(chuàng)建完原有圖片的基礎上在第一張圖片前面創(chuàng)建imageView顯示最后一張圖片，在最后一張圖片后面創(chuàng)建imageView顯示第一張圖片,這樣在最后一張往后滑觉吭，第一張往前滑腾供，然后再經(jīng)過計算修改scrollView的contentOffset，就可以實現(xiàn)輪播頁的 首尾無縫銜接鲜滩。
具體實現(xiàn)
1伴鳖，首先創(chuàng)建scrollView，這里使用懶加載進行創(chuàng)建
- (UIScrollView *)scrollView {
if (!_scrollView) {
UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:self.bounds];
//初始contentOffset為self.frame.size.width
scrollView.contentOffset = CGPointMake(self.frame.size.width, 0);
//contentSize的width為圖片的數(shù)量加2徙硅，因為頭尾各多加了一張圖片
scrollView.contentSize = CGSizeMake(self.frame.size.width*(_images.count+2), self.frame.size.height);
scrollView.pagingEnabled = YES;
scrollView.showsHorizontalScrollIndicator = NO;
scrollView.showsVerticalScrollIndicator = NO;
scrollView.bounces = NO;
scrollView.delegate = self;
[self addSubview:scrollView];
_scrollView = scrollView;
}
return _scrollView;
}
2榜聂，懶加載創(chuàng)建imageView
- (void)createImageViews {
for (NSInteger i = 0; i < _images.count + 2; i++) {
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(self.frame.size.width*i, 0, self.frame.size.width, self.frame.size.height)];
//創(chuàng)建self.images.count + 2個imageView，為了實現(xiàn)左右滑動無縫連接嗓蘑，除了正常的圖片之外须肆，在第一張之前加上最后一張匿乃，在最后一張后加上第一張
if (i == 0) {
imageView.image = _images[_images.count-1];
} else if (i == _images.count + 1) {
imageView.image = _images[0];
} else {
imageView.image = _images[i - 1];
}
[self.scrollView addSubview:imageView];
}
}
3，懶加載創(chuàng)建pageControl
- (UIPageControl *)pageControl {
if (!_pageControl) {
UIPageControl *pageControl = [[UIPageControl alloc] init];
pageControl.numberOfPages = self.images.count;
self.currentPage = 0;
pageControl.hidden = !self.isPageControlNeed;
pageControl.currentPage = self.currentPage;
CGSize pageControlSize = [pageControl sizeForNumberOfPages:self.images.count];
pageControl.frame = CGRectMake((self.frame.size.width - pageControlSize.width)/2, self.frame.size.height - 50, pageControlSize.width, pageControlSize.height);
[self addSubview:pageControl];
_pageControl = pageControl;
}
return _pageControl;
}
4豌汇，懶加載創(chuàng)建定時器幢炸，為了防止滑動界面的時候定時器停止，把定時器的mode設置成NSRunLoopCommonModes
- (NSTimer *)timer {
if (!_timer) {
//創(chuàng)建定時器前先刪除拒贱，可以防止多次創(chuàng)建
[_timer invalidate];
//創(chuàng)建定時器
NSTimer *timer = [NSTimer timerWithTimeInterval:_timeInterval target:self selector:@selector(imageScroll) userInfo:nil repeats:YES];
//添加到當前RunLoop中宛徊，設置模式為NSRunLoopCommonModes，可以防止滑動界面的時候定時器停止
[[NSRunLoop currentRunLoop] addTimer:timer forMode:NSRunLoopCommonModes];
_timer = timer;
}
return _timer;
}
5逻澳，設置定時器的滾動動畫,每次執(zhí)行當前頁面加一闸天，在block里修改contentOffSet,執(zhí)行動畫，然后判斷是否是最后一張圖片赡盘，如果是号枕，重設currentPage，contentOffset陨享。
//滾動動畫
- (void)imageScroll {
self.currentPage++;
//執(zhí)行動畫
[UIView animateWithDuration:self.scrollAnimateDuration animations:^{
self.scrollView.contentOffset = CGPointMake(self.frame.size.width*(_currentPage+1), 0);
}];
if (self.currentPage == self.images.count) {
self.currentPage = 0;
self.scrollView.contentOffset = CGPointMake(self.frame.size.width*(_currentPage+1), 0);
;
}
self.pageControl.currentPage = self.currentPage;
}
6葱淳，上面已經(jīng)設定好自動滾動的功能，下面我們要考慮手動滑動的邏輯判斷抛姑，首先我們要遵守UIScrollViewDelegate協(xié)議赞厕，然后實現(xiàn)其代理，在滑動結束后定硝，判斷當前坐標皿桑，然后修改currentPage，如果在最后一頁或者第一頁蔬啡，則修改contentOffset
#pragma mark - UIScrollViewDelegate
//設置代理輪動完成后觸發(fā)
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
NSInteger offSet = scrollView.contentOffset.x;
//判斷是否為最后一頁
if (offSet == self.frame.size.width*(self.images.count+1)) {
offSet = self.frame.size.width;
self.scrollView.contentOffset = CGPointMake(offSet, 0);
self.currentPage = 0;
}
//判斷是否為第一頁
else if (offSet == 0) {
offSet = self.frame.size.width*self.images.count;
self.scrollView.contentOffset = CGPointMake(offSet, 0);
self.currentPage = self.images.count - 1;
}
//其它情況
else {
self.scrollView.contentOffset = CGPointMake(offSet, 0);
self.currentPage = offSet/self.frame.size.width - 1;
}
self.pageControl.currentPage = self.currentPage;
}
到這里為止一個無縫銜接的廣告滾動頁就完成了诲侮，有任何疑問請留言
Github：https://github.com/tinybird00/ZSXScrollAdView
