Custom UICollectionViewLayout and floating supplementary header views crash - ios

Question

I am trying to create a UICollectionView which represents a grid and I would like to create a ruler (floating header view) at the top edge which floats along in the y-axis.
So, much like in UITableViews, this view should basically just scroll with the content at the top of the screen. I hope that description makes it clear enough. So much for theory, let's get to the practical part!
Here is what I am working with now:
I registered the class GridRulerView which is a subclass of
UICollectionReusableView with the collection view.
I return the correct Size for the supplementary view for the right kind and CGSizeZero where there is no header.
I implemented viewForSupplementaryElementOfKind::
func collectionView(collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, atIndexPath indexPath: NSIndexPath) -> UICollectionReusableView
{
var reusableHeaderView : UICollectionReusableView!
if kind == GridRulerView.Kind{
reusableHeaderView = collectionView.dequeueReusableSupplementaryViewOfKind(GridRulerView.Kind, withReuseIdentifier: GridRulerView.Kind, forIndexPath: indexPath) as! UICollectionReusableView
}
return reusableHeaderView
}
I have a custom UICollectionViewLayout with the following
layoutAttributesForElementsInRect: method:
override func layoutAttributesForElementsInRect(rect: CGRect) -> [AnyObject]? {
var attribs = [UICollectionViewLayoutAttributes]()
for (indexPath, attrs) in self.attributes{
if CGRectIntersectsRect(rect, attrs.frame) {
attribs.append(attrs)
}
}
var headerAttributes = GridViewRulerAttributes(forSupplementaryViewOfKind: GridRulerView.Kind, withIndexPath: NSIndexPath(forItem: 0, inSection: 0))
headerAttributes.zIndex = 500
headerAttributes.frame = CGRectMake(0, self.collectionView!.contentOffset.y, self.preCalculatedContentSize.width, 80)
attribs.append(headerAttributes)
return attribs
}
When I start the app, everything looks great, exactly how I want it.
BUT as soon as I scroll the collectionView beyond it's bounds (collectionView's contentOffset = (-0.5,-0.5) <- any negative values for example) I get a crash:
*** Assertion failure in -[UICollectionViewData validateLayoutInRect:], /SourceCache/UIKit/UIKit-3318.16.25/UICollectionViewData.m:426
The interesting thing is that if I set the header view attribute's frame's y property to 0 instead of the variable contentOffset.y (which becomes negative), everything works fine.
Anybody any idea why this happens ?
EDIT
Here is a more informative error message:
*** Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'layout attributes for supplementary item at index path ( {length = 2, path = 0 - 0}) changed from index path: ( {length = 2, path = 0 - 0}); element kind: (GridRulerViewKind); frame = (0 0; 425.227 24); zIndex = 500; to index path: ( {length = 2, path = 0 - 0}); element kind: (GridRulerViewKind); frame = (0 -5; 425.227 24); zIndex = 500; without invalidating the layout'

Answer 1

Wow, actually disabled "All Exceptions" breakpoints and got a more informative error to work with:
*** Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'layout attributes for supplementary item at index path ( {length = 2, path = 0 - 0}) changed from index path: ( {length = 2, path = 0 - 0}); element kind: (GridRulerViewKind); frame = (0 0; 425.227 24); zIndex = 500; to index path: ( {length = 2, path = 0 - 0}); element kind: (GridRulerViewKind); frame = (0 -5; 425.227 24); zIndex = 500; without invalidating the layout'
Now, I still had no idea what to do, or where to
"invalidate the layout"
Then while browsing similar questions, I came across a similar question here on SO where I stumbled upon this simple function:
override func shouldInvalidateLayoutForBoundsChange(newBounds: CGRect) -> Bool{
return true
}
And sure enough, that seemed to work! No crash anymore!
EDIT
Actually, this is causing the collection view layout to invalidate on every scroll, so this does not seem to be the solution I am looking for...
Edit #2
After a bit of research, I don't think it is possible to create a supplementary view that changes by itself without invalidating the layout (which kind of seems perfectly logical - how would the layout know to just update the ruler view without explicitly saying so ?). And updating the layout on each scroll is just way too expensive.
So I figured I will just create a separate view which is entirely independent of the collection view and simply listening to the collection view's scroll delegate and adjusting its frame according to the scroll offset. I think this approach is much more efficient in terms of performance and is equally easy to implement.

Answer 2

Solution
Just check representedElementKind
class CustomFlowLayout: UICollectionViewFlowLayout {
override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
let attributesForElementsInRect = super.layoutAttributesForElements(in: rect)
var newAttributesForElementsInRect = [UICollectionViewLayoutAttributes]()
for attributes in attributesForElementsInRect! {
if !(attributes.representedElementKind == UICollectionElementKindSectionHeader
|| attributes.representedElementKind == UICollectionElementKindSectionFooter) {
// cells will be customise here, but Header and Footer will have layout without changes.
}
newAttributesForElementsInRect.append(attributes)
}
return newAttributesForElementsInRect
}
}
class YourViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let headerNib = UINib.init(nibName: "HeaderCell", bundle: nil)
collectionView.register(headerNib, forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "HeaderCell")
let footerNib = UINib.init(nibName: "FooterCell", bundle: nil)
collectionView.register(footerNib, forSupplementaryViewOfKind: UICollectionElementKindSectionFooter, withReuseIdentifier: "FooterCell")
}
func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView {
switch kind {
case UICollectionElementKindSectionHeader:
let headerView = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: "HeaderCell", for: indexPath) as! HeaderCell
return headerView
case UICollectionElementKindSectionFooter:
let footerView = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: "FooterCell", for: indexPath) as! FooterCell
return footerView
default:
return UICollectionReusableView()
}
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize {
return CGSize(width: collectionView.frame.width, height: 45)
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForFooterInSection section: Int) -> CGSize {
return CGSize(width: collectionView.frame.width, height: 25)
}
}

Answer 3

Why you are passing GridRulerView.Kind for ReuseIdentifier?
reusableHeaderView = collectionView.dequeueReusableSupplementaryViewOfKind(GridRulerView.Kind, withReuseIdentifier: **GridRulerView.Kind**, forIndexPath: indexPath) as! UICollectionReusableView
It should be as below.
var supplementaryView =
collectionView.dequeueReusableSupplementaryViewOfKind(kind,
withReuseIdentifier:Identifiers.HeaderIdentifier.rawValue,
forIndexPath: indexPath) as UICollectionReusableView