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的生成會有一個延遲。
這樣就實現上面的那個動態效果。
