Aleksandar • Vacić

iOS bits and pieces

Problem: UICollectionViewCell redraw during interactive resize of UICollectionView

I’m very close to finishing the next big update of Unitica. Headline feature is that app is now Universal and I’ve built custom container controller that looks like this:

Update (Jul 6th, 2015): it’s a stupid bug on my side, see the end of this post.

I added background colors to clearly visualize the various child levels; at the top you have my custom split view controller with two child controllers:

  • category collection view controller
  • columns controller

This ColumnsController has two child controllers (orange and yellow) - each an instance of UnitViewController, which is UICollectionViewController subclass. Green and bluish violet are actual collection view cells. Layout is UICollectionViewFlowLayout subclass where I make sure that cells always span the full width of the collection view.
This is the most relevant part of the layout:

1
2
3
4
5
6
7
8
9
10
11
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds {
  return YES;
}

- (void)prepareLayout {
  CGFloat w = floor(self.collectionView.bounds.size.width);
  CGSize is = self.itemSize;
  is.width = w;
  self.itemSize = is;
  [super prepareLayout];
}

The problem I have is that I want to allow changing the split position between the CategoryController and ColumnsController. You just drag the divider in the middle to set the sizes as you wish. Or you can slide them all the way to the edge and have one of those full screen.

This simply refuses to obey and I’m out of ideas what to try to force a proper redraw. Here’s the video that illustrates the problem.

(If the above does not work, here’s the same video on YouTube)

It’s obvious from the video - it’s basically random what will happen and how it will rest. Here are several screenshots that illustrate the randomness.

  • Some cells are not re-drawn to full width

  • Multiple cells are not redrawn to full width

  • Cells go off the edge

  • Cells are not drawn to proper place so they look missing; see the right column - the missing cell is actually shorter and just below the filter field and another cell

  • In all cases, UICollectionView and UITextField that sit on top if it are always properly layouted - only the cells misbehave, as illustrated with background colors, again:

  • Here’s another clear example:

I have absolutelly no idea what to do with this. Maybe this kind of interactivity is simply not possible with UICollectionViewLayout, but I refuse to believe that.
I would hate to be forced to remove this feature, as I think it’s great.

Please tell me what I’m doing wrong.