将自定义标题添加到集合视图swift

时间:2017-02-13 08:21:34

标签: swift uicollectionview uicollectionreusableview

我正在尝试使用自定义xib文件向optString添加标头。我使用实现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

我收到错误:无法在捆绑中加载NIB。 任何遗失的代码?

HCollectionReusableView类:

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

}

3 个答案:

答案 0 :(得分:23)

您需要像这样致电 override func viewDidAppear(_ animated: Bool) { super.viewDidAppear(animated) UIApplication.shared.beginReceivingRemoteControlEvents() self.resignFirstResponder() }

viewForSupplementaryElementOfKind

这样您就可以初始化并显示标题

设置UICollectionViewHeader框架的另一种方法是扩展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") } } ,如下所示:

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 后注册HeaderView
UICollectionView

Swift 4.1更新

collectionView.register(UINib(nibName: HCollectionReusableView.nibName, bundle: nil), forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "HCollectionReusableView") 已重命名为UICollectionElementKindSectionHeader

答案 1 :(得分:0)

您是否在xib文件中设置了文件'所有者设置?将文件所有者更改为托管collectionView的View控制器。

enter image description here

答案 2 :(得分:0)

final class MyCollectionViewController: UICollectionViewController, UICollectionViewDelegateFlowLayout {

override func viewDidLoad() {
    super.viewDidLoad()

    self.collectionView!.register(UICollectionReusableView.self, forSupplementaryViewOfKind: UICollectionView.elementKindSectionHeader, withReuseIdentifier: MyCollectionReusableView.reuseIdentifierHeader)
}

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

override func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView {
    let header = collectionView.dequeueReusableSupplementaryView(ofKind: UICollectionView.elementKindSectionHeader, withReuseIdentifier: MyCollectionReusableView.reuseIdentifierHeader, for: indexPath) as! MyCollectionReusableView
    header.setupView()
    
    return header
}
}

final class MyCollectionReusableView: UICollectionReusableView {

   static let reuseIdentifierHeader = "MyId"

   func setupView() {
      //Code...
   }

}