Springboard-like animation for deleting UICollectionViewCells

Question

I am trying to figure out a way to animate the deletion of a UICollectionViewCell similarly to springboard in iOS 7. The deleted cell should shrink into nothingness and the remaining cells should slide over to fill its place (the sliding is the important part). I have tried:

• Setting the frame of each cell to the frame of the previous cell, like so:

UICollectionViewCell *cell = [self.collectionView cellForItemAtIndexPath:[NSIndexPath indexPathForItem:i inSection:0]];
CGRect rect = [self.collectionView cellForItemAtIndexPath:[NSIndexPath indexPathForItem:i - 1 inSection:0]].frame;      
[UIView animateWithDuration:0.2 animations:^{
    cell.frame = rect;
}];

But this did not work, as the cells did not move at all.

• Both of the following:

[self.collectionView performBatchUpdates:^{
    [self.collectionView reloadSections:[NSIndexSet indexSetWithIndex:0]];
} completion:nil];

and

[UIView animateWithDuration:0.2 animations:^{
    [self.collectionView reloadSections:[NSIndexSet indexSetWithIndex:0]];
}];

But these make the cells crossfade to their required spots, not slide.

I also found this project, which uses the following:

for (int i = index+1; i<[items count]; i++) {
    SEMenuItem *item = [items objectAtIndex:i];
    [UIView animateWithDuration:0.2 animations:^{

        if (i < index + remainingNumberOfItemsInPage) {

            int intVal = item.frame.origin.x;
            if (intVal %3== 0)
                [item setFrame:CGRectMake(item.frame.origin.x+2*item.frame.size.width, item.frame.origin.y-item.frame.size.height-5, item.frame.size.width, item.frame.size.height)];
            else
                [item setFrame:CGRectMake(item.frame.origin.x-item.frame.size.width, item.frame.origin.y, item.frame.size.width, item.frame.size.height)];
        }

        [item updateTag:item.tag-1];
    }];
}

However, it is not in a UICollectionView, so it does not help me.

Note: I am doing this on an iPad, just in case it matters to you.

Any ideas?

Answer 1

Subclass UICollectionViewFlowLayout. Implement:

- (UICollectionViewLayoutAttributes *)finalLayoutAttributesForDisappearingItemAtIndexPath:(NSIndexPath *)indexPath
{
    UICollectionViewLayoutAttributes *attr = [self layoutAttributesForItemAtIndexPath:indexPath]; // might need to replace self with super

    attr.transform = CGAffineTransformMakeScale(0, 0);

    return attr;
}