소개

안녕하세요
UITableViewHeaderFooterView라는
tableView 섹션에서 사용할 수 있는 View입니다.register(_: ,forHeaderFooterViewReuseIdentifier: )라는 재사용의 메소드가 tableView에 있습니다만,

이미지처럼 xib 파일을 동시에 만들 수 없어서 곤란했기 때문에,
정리하고 싶습니다.
이르지 못하는 점 등 많이 있다고 생각합니다만, 코멘트등 받을 수 있으면 다행입니다.

커스텀 클래스와 xibFile 만들기

UITableViewHeaderFooterView를 상속한 사용자 지정 클래스

CustomHeaderFooterView.swift

import UIKit

class CustomHeaderFooterView: UITableViewHeaderFooterView {
    @IBOutlet weak var view: UIView!

    override func awakeFromNib() {       
    }
}

xibFile

일반 View를 xib에서 준비하도록,
File -> New -> File... -> User Interface의 View를 선택하여 xibFile을 생성합니다.

"Custom Class"를 방금 만든 CustomHeaderFooterView로 설정했습니다.

Simulated Metrics의 설정과 크기를 조정하면 View를 쉽게 볼 수 있다고 생각합니다.


UIView를 추가합니다. UITableViewHeaderFooterView가 가지는 contentView가 참조만의 프로퍼티로 조금 다루기 어렵기 때문입니다. (별로 좋지 않을 수 있습니다 ...)

TableView에서 사용

tableView에 CustomHeaderFooterView를 초기화하도록 등록합니다.

ViewController.swift

override func viewDidLoad() {
    super.viewDidLoad()
    //xibの生成
    let xib = UINib(nibName: "CustomHeaderFooterView", bundle: nil)
    //再利用するための準備
    tableView.register(xib, forHeaderFooterViewReuseIdentifier: "CustomHeaderFooterView")
}

TableView의 Delegate에게 Section 재사용을 요청합니다.

extension ViewController: UITableViewDelegate{
    //セクションの設定
    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let headerFooterView = tableView.dequeueReusableHeaderFooterView(withIdentifier: "CustomHeaderFooterView") as! CustomHeaderFooterView
        return headerFooterView
    }
}

샘플 코드

일단 샘플 코드 (작동시킨 ViewController)를 붙여두고 싶습니다.

ViewController.swift

import UIKit

class ViewController: UIViewController{
    @IBOutlet weak var tableView: UITableView!

    var sectionData:[UIColor] = [UIColor.brown,UIColor.green,UIColor.cyan]
    var cellData:[String] = ["セル 1","セル 2","セル 3"]

    override func viewDidLoad() {
        super.viewDidLoad()
        tableView.dataSource = self
        tableView.delegate = self
        //セクションの高さを設定
        tableView.sectionHeaderHeight = 44
        //xibの生成
        let xib = UINib(nibName: "CustomHeaderFooterView", bundle: nil)
        //再利用するための準備
        tableView.register(xib, forHeaderFooterViewReuseIdentifier: "CustomHeaderFooterView")
    }
}

extension ViewController: UITableViewDataSource{
    //テーブルの行ごとのセルを返却する
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = UITableViewCell()
        cell.textLabel?.text = cellData[indexPath.row]
        return cell
    }
    //テーブルの行数を返却
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return cellData.count
    }
    //セクションの個数を返します
    func numberOfSections(in tableView: UITableView) -> Int {
        return sectionData.count
    }
}

extension ViewController: UITableViewDelegate{
    //セクションの設定
    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let headerFooterView = tableView.dequeueReusableHeaderFooterView(withIdentifier: "CustomHeaderFooterView") as! CustomHeaderFooterView
        headerFooterView.view.backgroundColor = sectionData[section]
        return headerFooterView
    }
}

참고로 한 기사

스택 오버플로

감사합니다.