20150717102107315.jpg
废话不说，先上效果图，如果觉得效果不错的话，可以继续往下看。
DynamicCell.gif
这是我在cocoaChina上看到的，不过那位仁兄用的xib完成的，但我发现如果用纯代码写的话，按照他的的那个思路并不能实现这个效果。
整个视图用的是collectionView的（当然你也可以用UITableView来写）下面的代码只是简单的创建UICollectionView。
UICollectionViewFlowLayout*flowLayout = [UICollectionViewFlowLayoutnew];
[flowLayoutsetScrollDirection:UICollectionViewScrollDirectionVertical];
self.collectionView= [[UICollectionViewalloc]initWithFrame:CGRectMake(0,64,self.view.width,self.view.height)collectionViewLayout:flowLayout];
self.collectionView.contentInset=UIEdgeInsetsMake(0,0,60,0);
self.collectionView.delegate=self;
self.collectionView.dataSource=self;
self.collectionView.backgroundColor= [UIColorcolorWithRed:0.369green:0.357blue:0.604alpha:1.000];
[self.collectionViewregisterClass:[CustomCollectionCellclass]forCellWithReuseIdentifier:@"CollectionViewCell"];
[self.viewaddSubview:self.collectionView];
[self.collectionViewselectItemAtIndexPath:[NSIndexPathindexPathForItem:0inSection:0]animated:YESscrollPosition:UICollectionViewScrollPositionBottom];
self.automaticallyAdjustsScrollViewInsets=NO;
紧接着需要实现collectionView的代理方法
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
cellForItemAtIndexPath:(NSIndexPath *)indexPath
#pragma mark - UICollectionViewDelegateFlowLayout
- (CGSize)collectionView:(UICollectionView *)collectionView
layout:(UICollectionViewLayout *)collectionViewLayout
sizeForItemAtIndexPath:(NSIndexPath *)indexPath
其实这个动态效果就只是一个frame的变化，在生成cell的时候让它的frame为
- (void)prepareVisibleCellsForAnimationWithRow:(NSInteger )row
andCell:(CustomCollectionCell *)cell{
cell.frame = CGRectMake(-CGRectGetWidth(cell.bounds),
cell.frame.origin.y,
CGRectGetWidth(cell.bounds),
CGRectGetHeight(cell.bounds));
cell.alpha = 0.f;
}
这样只是让它整个的cell在屏幕的左边，之后可以用一个animation改变frame，成一个动态的效果。
- (void)animateVisibleCell:(CustomCollectionCell *)cell withRow:(NSInteger)row {
cell.alpha = 1.f;
[UIView animateWithDuration:0.25 delay:0.2 *row usingSpringWithDamping:0.8
initialSpringVelocity:1.0 options:0 animations:^{
cell.frame = CGRectMake(0.f, cell.frame.origin.y,
CGRectGetWidth(cell.bounds),
CGRectGetHeight(cell.bounds));
} completion:^(BOOL finished) {
}];
}
这两个方法在生成cell的地方调用即可，至于那个cell你也可以自定义一个。
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
cellForItemAtIndexPath:(NSIndexPath *)indexPath {
CustomCollectionCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"CollectionViewCell" forIndexPath:indexPath];
NSDictionary *dictionary = self.dataArray[indexPath.row];
cell.model = dictionary;
if (collectionView.contentSize.height - kScreen_Height > collectionView.contentOffset.y ||
collectionView.contentOffset.y < 0) {
if (collectionView.contentOffset.y == 0) {
[self prepareVisibleCellsForAnimationWithRow:indexPath.row andCell:cell];
[self animateVisibleCell:cell withRow:indexPath.row];
}else {
[self prepareVisibleCellsForAnimationWithRow:1 andCell:cell];
[self animateVisibleCell:cell withRow:1];
}
}
return cell;
}
if 中的判断只是在顶部下拉和在底部上拉的时候不会调用方法，以及在刚生成或刚进入该视图的时候（这时候collectionView.contentOffset.y == 0）屏幕中cell的生成会有一个延迟。
这样就实现上面的那个动态效果。
