對(duì)于圖片的無(wú)限滾動(dòng)播放想必大家應(yīng)該可以找到很多輪子或者自己也能寫出一個(gè)霞丧，那么為什么我還要在這里寫呢目锭，其實(shí)也沒(méi)啥可以指出的要點(diǎn)厌秒，只是個(gè)人每天想寫點(diǎn)東西罷了荧呐，低調(diào)路過(guò)汉形。
實(shí)現(xiàn)無(wú)限滾動(dòng)的思路我個(gè)人認(rèn)為主要有兩種，一種是采用UICollectionView給定一定數(shù)量的Item倍阐，然后當(dāng)用戶不斷的滾動(dòng)的時(shí)候有足夠空間展示圖片概疆，當(dāng)用戶停止?jié)L動(dòng)了就馬上返回之前的中點(diǎn)，這樣相當(dāng)于有重置了Item的下標(biāo)峰搪，造成無(wú)限滾動(dòng)的效果岔冀。
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
NSInteger index = scrollView.contentOffset.x / scrollView.frame.size.width;
// 設(shè)置的Item個(gè)數(shù) 加上 需要展示的圖片數(shù) 等于距離中心點(diǎn)偏離的個(gè)數(shù)
NSInteger item = (ItemCount / 2) + (index % 5);
// 回滾到初始的中點(diǎn)位置
[((UICollectionView *)scrollView) scrollToItemAtIndexPath:[NSIndexPath indexPathForItem:item inSection:0] atScrollPosition:UICollectionViewScrollPositionNone animated:NO];
}
另外一種是利用UIScrollView來(lái)實(shí)現(xiàn)，在ScrollView添加內(nèi)容視圖控件概耻，有人用兩個(gè)使套，也有人用三個(gè)。這種方法核心就是判斷用戶滾動(dòng)的方向鞠柄，然后迅速的把移除屏幕的視圖擺放到準(zhǔn)備顯示的那邊屏幕侦高。本人這個(gè)項(xiàng)目是采用添加三個(gè)內(nèi)容視圖，另外本項(xiàng)目自帶了SDWebImage春锋，實(shí)現(xiàn)自動(dòng)加載網(wǎng)絡(luò)的圖片矫膨，如果你的項(xiàng)目有這個(gè)三方的話差凹，可以自行刪除期奔，GitHub,網(wǎng)絡(luò)原因還在上傳，如果看到代碼危尿，請(qǐng)自行忽略呐萌。
Cyclic.gif
其核心代碼如下：
#pragma mark - <UIScrollViewDelegate>
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
// 找出顯示在最中間的imageView
UIImageView *middleImageView = nil;
// x值和偏移量x的最小差值
CGFloat minDelta = MAXFLOAT;
for (NSInteger i = 0; i < LXImageViewCount; i++) {
UIImageView *imageView = self.scrollView.subviews[i];
// x值和偏移量x差值最小的imageView，就是顯示在最中間的imageView
CGFloat currentDelta = 0;
if (self.scrollDirection == LXCyclicScrollDirectionHorizontal) {
currentDelta = ABS(imageView.frame.origin.x - self.scrollView.contentOffset.x);
} else {
currentDelta = ABS(imageView.frame.origin.y - self.scrollView.contentOffset.y);
}
if (currentDelta < minDelta) {
minDelta = currentDelta;
middleImageView = imageView;
}
}
self.pageControl.currentPage = middleImageView.tag;
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
// 更新圖片內(nèi)容和scrollView的偏移量
[self updateContentAndOffset];
}
/**
* 更新圖片內(nèi)容和scrollView的偏移量
*/
- (void)updateContentAndOffset
{
// 1.更新imageView上面的圖片內(nèi)容
for (NSInteger i = 0; i < LXImageViewCount; i++) { // i是用來(lái)獲取imageView的
UIImageView *imageView = self.scrollView.subviews[i];
// 根據(jù)當(dāng)前頁(yè)碼求出imageIndex
NSInteger imageIndex = 0;
if (i == 0) { // 左邊
imageIndex = self.pageControl.currentPage - 1;
if (imageIndex == -1) { // 顯示最后面一張
imageIndex = self.images.count - 1;
}
} else if (i == 1) { // 中間
imageIndex = self.pageControl.currentPage;
} else if (i == 2) { // 右邊
imageIndex = self.pageControl.currentPage + 1;
if (imageIndex == self.images.count) { // 顯示最前面一張
imageIndex = 0;
}
}
imageView.tag = imageIndex;
// 圖片數(shù)據(jù) 考慮到無(wú)論傳遞什么參數(shù)都能加載到圖片
id obj = self.images[imageIndex];
if ([obj isKindOfClass:[UIImage class]]) { // UIImage對(duì)象
imageView.image = obj;
} else if ([obj isKindOfClass:[NSString class]]) { // 本地圖片名
imageView.image = [UIImage imageNamed:obj];
} else if ([obj isKindOfClass:[NSURL class]]) { // 遠(yuǎn)程圖片URL
[imageView sd_setImageWithURL:obj placeholderImage:self.placeholder];
}
}
// 2.設(shè)置scrollView.contentOffset.x = 1倍寬度
if (self.scrollDirection == LXCyclicScrollDirectionHorizontal) {
self.scrollView.contentOffset = CGPointMake(self.scrollView.frame.size.width, 0);
} else {
self.scrollView.contentOffset = CGPointMake(0, self.scrollView.frame.size.height);
}
}
再來(lái)看看頭文件谊娇，我提供了一下這些參數(shù)可以調(diào)整滾動(dòng)器
@class LXCyclicScrollView;
@protocol LXCyclicScrollViewDelegate <NSObject>
@optional
- (void)cyclicScrollView:(LXCyclicScrollView *)cisylicScrollView didClickImageAtIndex:(NSInteger)index;
@end
typedef NS_ENUM(NSInteger, LXCyclicScrollDirection) {
/** 左右滑動(dòng) */
LXCyclicScrollDirectionHorizontal = 0,
/** 上下滑動(dòng) */
LXCyclicScrollDirectionVertical
};
@interface LXCyclicScrollView : UIView
/** 圖片數(shù)據(jù)(里面可以存放UIImage對(duì)象肺孤、NSString對(duì)象【本地圖片名】、NSURL對(duì)象【遠(yuǎn)程圖片的URL】) */
@property (nonatomic, strong) NSArray *images;
/** 占位圖片 */
@property (nonatomic, strong) UIImage *placeholder;
/** 每張圖片之間的時(shí)間間隔 */
@property (nonatomic, assign) NSTimeInterval interval;
/** 可以修改頁(yè)碼控制器的顏色等 */
@property (nonatomic, weak, readonly) UIPageControl *pageControl;
/** 圖片滾動(dòng)的方向 */
@property (nonatomic, assign) LXCyclicScrollDirection scrollDirection;
/** 代理 */
@property (nonatomic, weak) id<LXCyclicScrollViewDelegate> delegate;
@end
