Animate UICollectionView cell size change and reposition surrounding cells

Question

Goal:

To animate the change of a cell's height and reposition surrounding cells.

Scenario:

Some cells in a collection view load remote images. Initially, those cells are sized statically and an activity indicator is shown. After an image is loaded, it is added to its cell and the cell's height is changed to fit the photo.

Notes:

I am animating the cell's frame change with animateWithDuration. This works fine, except an increased cell size has it overlapping the cells below. I've blindly tried calling collectionView.collectionViewLayout invalidateLayout after resizing the target cell and updating the size returned by sizeForItemAtIndexPath with no success.

Any suggestions? Thank you!

Sample Code:

https://github.com/juzzin/ResizeUICollectionViewCell/blob/master/ResizeUICollectionViewCell/FLOViewController.m

Answer 1

Basically you need to do three steps

1.invalidate the collectionViewLayout

2.perform batch updates:

 ...
 //invalidate layout
[collectionView performBatchUpdates:^{
    // make your cell at indexPath return a new size
} completion:^(BOOL finished) {

}];

3.return the new size at sizeForItemAtIndexpath