先看一下效果:
QQ20180725-190614.gif
实现一个UICollectionView的每个Cell分别弹出的动画效果.
需要注意:
· 如何获取CollectionView中的每一个cell.
· 如何让每个cell非同时地调用动画.
· 调用动画的方法的时机.
1.假设我们已经写好了动画方法animateCollection.如何在CollectionView加载时调用动画呢.
其实很简单, 如下:
-(void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated];
[self animateCollection];
}
此外, 如果有其他条件要调用动画怎么办呢?
那么,你可能要问了,,什么时候会调用呢...
比如下面这个例子,,,在reloaddata之后,重新展示新内容,我们也想要有一次加载的过程来提高用户体验.
QQ20180725-191845.gif
在segment改变值的时候调用动画方法,代码如下
- (void)changeMode:(id)sender
{
//增加layoutIfNeed的目的是让animateCollection在reload完成之后再执行
[self->_collectionView reloadData];
[self->_collectionView layoutIfNeeded];
[self animateCollection];
}
特别注意,在reloadData和动画方法中间一定要加上layoutIfNeeded方法,这样才能确保,collectionView在数据全部重载之后再调用动画方法.
2.再来看看动画怎么实现吧.
直接上代码
-(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];
}
}
具体实现代码已经表述的比较明白,就不赘述了...此外,让cell动态消失的方法也类似
