Button on header of colelctionview not visible

Hello, I'm trying to write an application in objecgtive-c that neeed to have some button on the header of a collectionview. It's visible on the preview, but not on the simulator, neither on a iphone. And I can't find why is that. I saw a lot of diffrent poste on internet about that, but can't find the issue! Preview:

Simulator:

Everythink is done on storayboard, so I don't know what to share, the storyboard file is 244Mb

Answered by Claude31 in 692618022

It is not visible because the header is not drawn.

You need to create a few elements:

  • You have declared a header section in the collectionView Attributes Inspector by enabling Section Header in Accessories:

  • create a class for the headerView (new file); I named it Item1HeaderView but you can choose something else of course:
import UIKit

class Item1HeaderView: UICollectionReusableView {
    @IBOutlet weak var titleLabel: UILabel!

    @IBAction func headerButtonAction(_ sender: UIButton) {
        print("button was hit")
    }
}

That's Swift but is is immediate to write this in objC.

  • set the header view to the right class (Item1HeaderView) in its Identity Inspector

  • set the proper identifier in its Attributes Inspector:

  • Create button and label inside ;

  • Connect button and Label to their IBAction and IBOutlet in Item1HeaderView class.

  • In the class where the CollectionView is, add this delegate func:

    func collectionView(_ collectionView: UICollectionView,
      viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView {
        
      switch kind {
      case UICollectionView.elementKindSectionHeader:

          let headerView = collectionView.dequeueReusableSupplementaryView(ofKind: kind, 
                            withReuseIdentifier: "\(Item1HeaderView.self)", 
                            for: indexPath)  // Or simply withReuseIdentifier: "Item1HeaderView"
          headerView.backgroundColor = .yellow
          guard let typedHeaderView = headerView as? Item1HeaderView else { return headerView }

          typedHeaderView.titleLabel.text = "Hello"
          return typedHeaderView
      default:
          print("No header")
      }

      return UICollectionReusableView()
    }

That should now work.

See full details in this tutorial:

h t t p s : / / w w w.raywenderlich.com/21959913-uicollectionview-tutorial-headers-selection-and-reordering

Accepted Answer

It is not visible because the header is not drawn.

You need to create a few elements:

  • You have declared a header section in the collectionView Attributes Inspector by enabling Section Header in Accessories:

  • create a class for the headerView (new file); I named it Item1HeaderView but you can choose something else of course:
import UIKit

class Item1HeaderView: UICollectionReusableView {
    @IBOutlet weak var titleLabel: UILabel!

    @IBAction func headerButtonAction(_ sender: UIButton) {
        print("button was hit")
    }
}

That's Swift but is is immediate to write this in objC.

  • set the header view to the right class (Item1HeaderView) in its Identity Inspector

  • set the proper identifier in its Attributes Inspector:

  • Create button and label inside ;

  • Connect button and Label to their IBAction and IBOutlet in Item1HeaderView class.

  • In the class where the CollectionView is, add this delegate func:

    func collectionView(_ collectionView: UICollectionView,
      viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView {
        
      switch kind {
      case UICollectionView.elementKindSectionHeader:

          let headerView = collectionView.dequeueReusableSupplementaryView(ofKind: kind, 
                            withReuseIdentifier: "\(Item1HeaderView.self)", 
                            for: indexPath)  // Or simply withReuseIdentifier: "Item1HeaderView"
          headerView.backgroundColor = .yellow
          guard let typedHeaderView = headerView as? Item1HeaderView else { return headerView }

          typedHeaderView.titleLabel.text = "Hello"
          return typedHeaderView
      default:
          print("No header")
      }

      return UICollectionReusableView()
    }

That should now work.

See full details in this tutorial:

h t t p s : / / w w w.raywenderlich.com/21959913-uicollectionview-tutorial-headers-selection-and-reordering

Yes you totaly wright, I didn't have the ICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView implementated.

It's alitle bit hard nowday to find some information on objective-c, everything is in Siwft!

Button on header of colelctionview not visible
 
 
Q