UICollectionView showing old cells when changing layout

Question

I have a UICollectionView inside a UIViewController. I also have two different layouts that I change to when a button is pressed.

The layouts change between two cells that I have created in two nib files. Since the two cells do the same change and their layouts are just different - I've used the same class for them both, which is a subclass of UICollectionViewCell.

So, when my view loads, I register my two cells, like so:

[self.tradeFeedCollectionView registerNib:[UINib nibWithNibName:@"BBItemTableViewCell" bundle:nil] forCellWithReuseIdentifier:@"TableItemCell"];
[self.tradeFeedCollectionView registerNib:[UINib nibWithNibName:@"BBItemGridViewCell" bundle:nil] forCellWithReuseIdentifier:@"GridItemCell"];

The two layouts are a subclass of UICollectionViewFlowLayout. In the layout subclass I just use one method to set the size and spacing of the layouts / cells - like so:

-(id)init
{
    self = [super init];

    if (self){

        self.itemSize = CGSizeMake(320, 80);
        self.minimumLineSpacing = 0.1f;
    }

    return self;
}

This works as cells are always the correct size when changing views.

To change views I have a UIButton that has the following code:

[self.tradeFeedCollectionView.collectionViewLayout invalidateLayout];

if (!self.gridLayoutActive){

    self.gridLayoutActive = YES;
    [self.tradeFeedCollectionView setCollectionViewLayout:self.grideLayout animated:YES];
    self.lastLayoutUsed = @"GridLayout";

}

else {

    self.gridLayoutActive = NO;

    [self.tradeFeedCollectionView setCollectionViewLayout:self.tableViewLayout animated:YES];
    self.lastLayoutUsed = @"TableLayOut";
}

With the above code, I get a nice animation and the view changes between the two cells.

The Problem

When changing views the visible area of the UICollectionView has the old cells left behind and has not updated to new cells. The cells have actually changed shape, but the view from the old cells are left behind. When I start scrolling - the cells show correctly and all old cells are gone.

**What I tried **

I found that calling this code:

[self.collectionView reloadItemsAtIndexPaths:[self.collectionView indexPathsForVisibleItems]];

After I have changed the layout solves it a little - however, I loose animation and it looks odd.

Answer 1

I actually solved this problem:

See my question here: Calling setCollectionViewLayout:animated does not reload UICollectionView

I updated my question with the solution that worked for me.