記錄下自己項目中用到的循環(huán)輪播功能。

image.png

項目采用UICollectionView來實(shí)現(xiàn)滾動的功能脓恕，頁面類似同花順的股票詳情切換哈肖，點(diǎn)擊列表數(shù)據(jù)的時候展示左右切換按鈕，來實(shí)現(xiàn)標(biāo)題的滾動以及頁面數(shù)據(jù)的重新請求躲履。

@interface StockNavigationView () <UICollectionViewDataSource, UICollectionViewDelegate>

@property (weak, nonatomic) IBOutlet UIButton *thePreviousBtn;
@property (weak, nonatomic) IBOutlet UIButton *theNextBtn;
@property (weak, nonatomic) IBOutlet UICollectionView *collectionView;
@property (nonatomic, strong) NSArray *dataAry;
@property (weak, nonatomic) IBOutlet UICollectionViewFlowLayout *flowLayout;
@property (nonatomic, assign) NSInteger totalItemsCount;

@end

實(shí)現(xiàn)的思路是见间，通過加載比實(shí)際內(nèi)容多的cell來形成左右無限循環(huán)滾動的效果，即self.totalItemsCount = self.dataAry.count * 100;

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    return self.totalItemsCount;
}

因為加載了很多的cell工猜，所以需要通過相應(yīng)的算法來計算準(zhǔn)確的index角標(biāo)值米诉。

- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    StockNavigationCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"StockNavigationCell" forIndexPath:indexPath];
    long itemIndex = [self pageControlIndexWithCurrentCellIndex:indexPath.item];
    [cell em_displayWithID:self.dataAry[itemIndex]];

    return cell;
}

通過currentIndex方法計算出UICollectionView當(dāng)前的偏移量，然后通過- (int)pageControlIndexWithCurrentCellIndex:(NSInteger)index;方法計算出在實(shí)際數(shù)組self.dataAry內(nèi)的索引值篷帅。

- (int)pageControlIndexWithCurrentCellIndex:(NSInteger)index {
    return (int)index % self.dataAry.count;
}

- (int)currentIndex {
    if (_collectionView.frame.size.width == 0 || _collectionView.frame.size.height == 0) {
        return 0;
    }
    
    int index = 0;
    if (_flowLayout.scrollDirection == UICollectionViewScrollDirectionHorizontal) {
        index = (_collectionView.contentOffset.x + _flowLayout.itemSize.width * 0.5) / _flowLayout.itemSize.width;
    } else {
        index = (_collectionView.contentOffset.y + _flowLayout.itemSize.height * 0.5) / _flowLayout.itemSize.height;
    }
    
    return MAX(0, index);
}

然后添加上一頁和下一頁的方法

- (IBAction)thePreviousBtnClick:(id)sender {
    if (0 == _totalItemsCount) return;
    int currentIndex = [self currentIndex];
    int targetIndex = currentIndex - 1;
    [self scrollToIndex:targetIndex];
}

- (IBAction)theNextBtnClock:(id)sender {
    if (0 == _totalItemsCount) return;
    int currentIndex = [self currentIndex];
    int targetIndex = currentIndex + 1;
    [self scrollToIndex:targetIndex];
}

通過- (void)scrollToItemAtIndexPath:(NSIndexPath *)indexPath atScrollPosition:(UICollectionViewScrollPosition)scrollPosition animated:(BOOL)animated;方法來滾動到相應(yīng)的位置史侣。

- (void)scrollToIndex:(int)targetIndex {
    if (targetIndex >= _totalItemsCount) {
        targetIndex = _totalItemsCount * 0.5;
        int indexOnPageControl = [self pageControlIndexWithCurrentCellIndex:targetIndex];
        NSDictionary *dict = self.dataAry[indexOnPageControl];
        if (self.stockNavigationBlock) {
            self.stockNavigationBlock(dict[@"name"], dict[@"num"], dict[@"instrument"]);
        }

        [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForItem:targetIndex inSection:0] atScrollPosition:UICollectionViewScrollPositionNone animated:NO];
        return;
    }
    
    [UIView animateWithDuration:0.3 animations:^{
        [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForRow:targetIndex inSection:0] atScrollPosition:UICollectionViewScrollPositionNone animated:NO];
    } completion:^(BOOL finished) {
        int indexOnPageControl = [self pageControlIndexWithCurrentCellIndex:targetIndex];
        NSDictionary *dict = self.dataAry[indexOnPageControl];
        if (self.stockNavigationBlock) {
            self.stockNavigationBlock(dict[@"name"], dict[@"num"], dict[@"instrument"]);
        }
    }];
//    [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForItem:targetIndex inSection:0] atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:YES];
}

為了在UICollectionView左右手勢滑動的方法中實(shí)現(xiàn)相應(yīng)的功能，我們在- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView;方法中實(shí)現(xiàn)了- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView;方法魏身，達(dá)到了停止?jié)L動后惊橱，都能產(chǎn)生響應(yīng)。

// 滾動視圖減速完成叠骑，滾動將停止時李皇，調(diào)用該方法。一次有效滑動，只執(zhí)行一次掉房。
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
    [self scrollViewDidEndScrollingAnimation:self.collectionView];
}

- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView {
    int itemIndex = [self currentIndex];
    int indexOnPageControl = [self pageControlIndexWithCurrentCellIndex:itemIndex];
    NSDictionary *dict = self.dataAry[indexOnPageControl];
    if (self.stockNavigationBlock) {
        self.stockNavigationBlock(dict[@"name"], dict[@"num"], dict[@"instrument"]);
    }
}

最后茧跋，只需要在- (void)layoutSubviews;方法中，將self.collectionView滾動到居中的位置即可卓囚。其中self.index為傳入數(shù)組的偏移量瘾杭。

- (void)layoutSubviews {
    [super layoutSubviews];
    
    if (self.collectionView.contentOffset.x == 0 && _totalItemsCount) {
        int targetIndex = _totalItemsCount * 0.5;
        [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForItem:targetIndex + self.index inSection:0] atScrollPosition:UICollectionViewScrollPositionNone animated:NO];
    }
}

至此，一個簡單循環(huán)滾動功能就完成了哪亿，如果有需要的話粥烁，還可以加上定時器等等等，當(dāng)然了蝇棉，這些都有現(xiàn)成的框架可以用讨阻。

本文中的代碼，參考自SDCycleScrollView的源碼篡殷。