How to programmatically add header on UICollectionView with UICollectionViewLayout

Question

I have a UICollectionView in one of my viewcontroller. My collection view uses a subclass of UICollectionViewLayout (custom) to layout the cells. First thing, as soon as I select Layout as Custom in dropdown on Storyboard, option to select supplementary views goes away.

I tried doing that programatically as shown below, but none of the delegate methods are getting called.

- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
{
    if (kind == UICollectionElementKindSectionHeader) {

        UICollectionReusableView *reusableview = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"HeaderView" forIndexPath:indexPath];

        if (reusableview==nil) {
            reusableview=[[UICollectionReusableView alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
          }

        UILabel *label=[[UILabel alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
        label.text=[NSString stringWithFormat:@"Recipe Group #%li", indexPath.section + 1];
        [reusableview addSubview:label];
        return reusableview;
      }
    return nil;
  }

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section {
    CGSize headerSize = CGSizeMake(320, 44);
    return headerSize;
  }

In my viewDidLoad Method I have

[self.collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"HeaderView"];

Can anyone point me where I'm messing up?

Answer 1

You're passing in the incorrect view kind.

Your line registering the class:

[self.collectionView registerClass:[UICollectionReusableView class]
  forSupplementaryViewOfKind:UICollectionElementKindSectionFooter
  withReuseIdentifier:@"HeaderView"];

Should be:

[self.collectionView registerClass:[UICollectionReusableView class]
  forSupplementaryViewOfKind: UICollectionElementKindSectionHeader
  withReuseIdentifier:@"HeaderView"];

Edit: Looks like your code is all using sectionFooter. Are you trying to programmatically add a header or a footer?

Answer 2

Found the issue, I was not returning attributes of my header in this UICollectionLayoutView method:

- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect; // return an array layout attributes instances for all the views in the given rect

Answer 3

Check that you gave reference size for header in UICollectionViewFlowLayout

[flowLayout setHeaderReferenceSize:CGSizeMake(320, 50)];

and for footer

[flowLayout setFooterReferenceSize:CGSizeMake(320, 50)];

Answer 4

Your delegate method for header reference size is wrong, you call footer method,referenceSizeForFooterInSection, as follow：

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section {
  CGSize headerSize = CGSizeMake(320, 44);
  return headerSize;
}

Individually set HeaderReferenceSize will fix the header problem. But app will crash you keep the above method and return nil in viewForSupplementaryElementOfKind for Footer.