Question

我知道如何向UICollectionViews添加标题，但我不知道如何自定义它们。我知道的方法类似于自定义UICollectionViewCells但是我可能缺少一些子类和一些必需的设置代码，因为当我将我的标题转换为此类时它失败...

class LiveHeader: UICollectionReusableView {


}

必须有一些必需的初始化代码或其他东西，但我还没有在网上找到任何例子。大多数人使用故事板来做这件事。

有什么建议吗？

修改

//reuse identifier.

let LiveHeaderId = "LiveHeaderId"

//viewDidLoad
override func viewDidLoad() {
    super.viewDidLoad()

    setupCollectionView()

    //Register Headers
    collectionView?.register(UICollectionViewCell.self, forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: LiveHeaderId)
    //Register Cells
    collectionView?.register(LiveCell.self, forCellWithReuseIdentifier: LiveCellId)

}

这是我设置标题视图的地方

override func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView {
    let liveHeader = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: LiveHeaderId, for: indexPath) as! LiveHeader
    liveHeader.backgroundColor = UIColor.clear
    /*
    //Here I ended up creating the view because I couldn't get the cast to work. This is my opinion clutters ups the code especially because I eventually want to register more headers
    let container: UIView = {
        let c = UIView()
        c.translatesAutoresizingMaskIntoConstraints = false
        c.backgroundColor = UIColor.clear
        return c

    }()

    let labelContainer: UIView = {
        let lc = UIView()
        lc.translatesAutoresizingMaskIntoConstraints = false
//            lc.backgroundColor = UIColor.init(red: 168/255, green: 250/255, blue: 0, alpha: 1)
        lc.backgroundColor = UIColor.init(red: 77/255, green: 182/255, blue: 172/255, alpha: 1)
        lc.layer.cornerRadius = 5
        return lc
    }()

    let label: UILabel = {
        let l = UILabel()
        l.text = "LIVE"
        l.font = UIFont.boldSystemFont(ofSize: 15)
        l.textAlignment = .center
        l.translatesAutoresizingMaskIntoConstraints = false
        l.textColor = UIColor.white
        return l
    }()

    liveHeader.addSubview(container)
    liveHeader.addConstraintsWithFormat("H:|[v0]|", views: container)
    liveHeader.addConstraintsWithFormat("V:|[v0]|", views: container)


    container.addSubview(labelContainer)
    labelContainer.widthAnchor.constraint(equalTo: container.widthAnchor, multiplier: 0.1).isActive = true
    labelContainer.heightAnchor.constraint(equalTo: container.heightAnchor, multiplier: 0.5).isActive = true
    labelContainer.centerYAnchor.constraint(equalTo: container.centerYAnchor).isActive = true
    NSLayoutConstraint(item: labelContainer, attribute: .centerX, relatedBy: .equal, toItem: container, attribute: .centerX, multiplier: 0.25, constant: 0).isActive = true


    labelContainer.addSubview(label)
    labelContainer.addConstraintsWithFormat("H:|[v0]|", views: label)
    labelContainer.addConstraintsWithFormat("V:|[v0]|", views: label)



    return liveHeader
} */


//header size

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

如果有什么我相信我可能会遗漏一些东西，请参阅我的观看补充资料中的一些资料。

Answer 1

与实施自定义s的方式相同。

UIView

示例带有标题标签的import UIKit class MyHeaderCollectionReusableView: UICollectionReusableView { var titleLabel: UILabel = { let label = UILabel() label.custom(title: "Title", font: .systemFont(ofSize: 20), titleColor: .black, textAlignment: .center, numberOfLines: 1) return label }() override init(frame: CGRect) { super.init(frame: frame) setupViews() setupConstraints() } required init?(coder aDecoder: NSCoder) { fatalError("init(coder:) has not been implemented") } } extension MyHeaderCollectionReusableView : ViewSetable { func setupViews() { autoresizingMask = [.flexibleWidth, .flexibleHeight] backgroundColor = .white addSubview(titleLabel) } func setupConstraints() { // Title label constraints. titleLabel.topAnchor.constraint(equalTo: topAnchor).isActive = true titleLabel.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true titleLabel.leadingAnchor.constraint(equalTo: leadingAnchor).isActive = true titleLabel.trailingAnchor.constraint(equalTo: trailingAnchor).isActive = true } } extension UILabel { func custom(title: String, font: UIFont, titleColor: UIColor, textAlignment: NSTextAlignment, numberOfLines: Int) { self.text = title self.textAlignment = textAlignment self.font = font self.textColor = titleColor self.numberOfLines = numberOfLines self.adjustsFontSizeToFitWidth = true self.translatesAutoresizingMaskIntoConstraints = false } /// Defines methods for creating view. protocol ViewSetable { /// Creates view hierarchy. func setupViews() /// Creates anchors between views. func setupConstraints() }标题，该标题与给定标题高度的整个空格相匹配。

修改

当您注册标题时，您无法通过以下方式注册：

UICollectionView

将其更改为：

collectionView?.register(UICollectionViewCell.self, forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: LiveHeaderId)

它应该解决你的问题！

以编程方式设置标题视图

1 个答案: