先看一下效果:

QQ20180725-190614.gif

實現(xiàn)一個UICollectionView的每個Cell分別彈出的動畫效果.

需要注意:
· 如何獲取CollectionView中的每一個cell.
· 如何讓每個cell非同時地調(diào)用動畫.
· 調(diào)用動畫的方法的時機.

1.假設我們已經(jīng)寫好了動畫方法animateCollection.如何在CollectionView加載時調(diào)用動畫呢.

其實很簡單, 如下:

-(void)viewDidAppear:(BOOL)animated
{
    [super viewDidAppear:animated];
    [self animateCollection];
}

此外, 如果有其他條件要調(diào)用動畫怎么辦呢?
那么,你可能要問了,,什么時候會調(diào)用呢...
比如下面這個例子,,,在reloaddata之后,重新展示新內(nèi)容,我們也想要有一次加載的過程來提高用戶體驗.

QQ20180725-191845.gif

在segment改變值的時候調(diào)用動畫方法,代碼如下

- (void)changeMode:(id)sender
{
    //增加layoutIfNeed的目的是讓animateCollection在reload完成之后再執(zhí)行
    [self->_collectionView reloadData];
    [self->_collectionView layoutIfNeeded];
    [self animateCollection];
}

特別注意,在reloadData和動畫方法中間一定要加上layoutIfNeeded方法,這樣才能確保,collectionView在數(shù)據(jù)全部重載之后再調(diào)用動畫方法.

2.再來看看動畫怎么實現(xiàn)吧.

直接上代碼

-(void)animateCollection{
    NSArray *cells = _collectionView.visibleCells;
    CGFloat collectionHeight = _collectionView.bounds.size.height;
    for (UICollectionViewCell *cell in cells.objectEnumerator) {
        cell.alpha = 1.0f;
        cell.transform = CGAffineTransformMakeTranslation(0, collectionHeight);
        NSUInteger index = [cells indexOfObject:cell];
        [UIView animateWithDuration:0.7f delay:0.05*index usingSpringWithDamping:0.8 initialSpringVelocity:0 options:0 animations:^{
            cell.transform =  CGAffineTransformMakeTranslation(0, 0);
        } completion:nil];
    }
}

具體實現(xiàn)代碼已經(jīng)表述的比較明白,就不贅述了...此外,讓cell動態(tài)消失的方法也類似