uicollectionviewにカスタムヘッダーを追加swift

Question

カスタムxibファイルを使用してcollectionViewにヘッダーを追加しようとしています。 xibを実装するクラスでUICollectionReusableViewファイルを作成しました。 collectionViewControllerに次のようなxibファイルを登録しました。

self.collectionView.register(UINib(nibName: HCollectionReusableView.nibName, bundle: nil), forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: HCollectionReusableView.reuseIdentifier)

そしてその後viewForSupplementaryElementOfKindで私はやった

let header = collectionView.dequeueReusableSupplementaryView(ofKind: UICollectionElementKindSectionHeader, withReuseIdentifier: HCollectionReusableView.reuseIdentifier, for: indexPath) as! HCollectionReusableView

そしてサイジングのために

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize {
    return CGSize(width: 100, height: 50)
}

エラーが発生しています：NIBをバンドルにロードできませんでした。不足しているコードはありますか？

HCollectionReusableViewクラス：

class HCollectionReusableView: UICollectionReusableView {

static var nibName : String
    {
    get { return "headerNIB"}
}

static var reuseIdentifier: String
    {
    get { return "headerCell"}
}



override func awakeFromNib() {
    super.awakeFromNib()
    // Initialization code
}

}

Answer 1

次のようにviewForSupplementaryElementOfKindを呼び出す必要があります。

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

    switch kind {
    case UICollectionElementKindSectionHeader:
           let reusableview = collectionView.dequeueReusableSupplementaryView(ofKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "HCollectionReusableView", for: indexPath) as! HCollectionReusableView

            reusableview.frame = CGRect(0 , 0, self.view.frame.width, headerHight)
         //do other header related calls or settups
            return reusableview


    default:  fatalError("Unexpected element kind")
    }
}

この方法で、ヘッダーを初期化して表示できます

UICollectionViewHeaderフレームを設定する別の方法は、UICollectionViewDelegateFlowLayoutを次のように拡張することです。

extension UIViewController: UICollectionViewDelegateFlowLayout {
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize {
        return CGSize(width: collectionView.frame.width, height: 100) //add your height here
    }
}

これにより、呼び出す必要がなくなります。

reusableview.frame = CGRect(0 , 0, self.view.frame.width, headerHight)

上記の

func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView

呼び出してUICollectionViewを初期化した後、HeaderViewを登録することを忘れないでください：

collectionView.register(UINib(nibName: HCollectionReusableView.nibName, bundle: nil), forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "HCollectionReusableView")

Swift 4.1アップデート

UICollectionElementKindSectionHeaderはUICollectionView.elementKindSectionHeaderに名前が変更されました

Answer 2

XibファイルでFile 'Owner設定を設定しましたか？ファイルの所有者を、collectionViewをホストしているView Controllerに変更します。