TableViewのSectionヘッダーやフッターの表示内容を変更する2つの方法

TableViewのSectionヘッダーとかフッターってありますよね。
こうゆうやつのことです（これはヘッダーです）。

これ、UITableViewDelegateを継承してるViewControllerで tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String?) -> UIView?をoverrideすれば出てきます（使い方はココの中のどこかに書いるはず）が、今回は表示内容（フォントの色とかサイズとか表示位置とか...etc）の変更方法をお送りします。

目次

1. tableView(_:viewForHeaderInSection:)を使って変更する

一つ目の方法は tableView(_:viewForHeaderInSection:)を使う方法。
UITableViewDelegateを継承してるViewControllerでtableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?をoverrideします。以下です。
中の処理はまだ空白。

class ViewController: UIViewController, UITableViewDelegate {
    ...(省略)...

    override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        //code ここでreturnしたUIViewがヘッダーに反映されるって仕組み
    }
}

上記の返り値にUIViewを規程されております。コメント記載している通りここでreturnしたUIViewがヘッダーに反映されるって仕組みになりますね。 ここでちょっと工夫しときましょ。UILabelにした方がフォントとか色とか直感的に分かりやすいです。なのでここではUILabelを返すことにしちゃえばどうだ（UILabelはUIViewを継承してるクラスなので問題ない）。

class ViewController: UIViewController, UITableViewDelegate {
    ...(省略)...

    override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let label = UILabel(frame: CGRect(x:0, y:0, width: tableView.bounds.width, height: 50))
        return label
    }
}

後は頭で定義してあげたlabelをゴリゴリにカスタムしてあげるだけです。

class ViewController: UIViewController, UITableViewDelegate {
    ...(省略)...

    override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let label = UILabel(frame: CGRect(x:0, y:0, width: tableView.bounds.width, height: 50))
        label.textAlignment = NSTextAlignment.center        //文字位置
        label.font = UIFont.italicSystemFont(ofSize: 21)    //文字サイズ
        label.backgroundColor = UIColor.red                 //背景色
        label.textColor =  UIColor.white                    //文字色
        label.text = "タイトル"                              //表示される文字
        return label
    }
}

結果、こんな表示になりました。

やったー！！！ってちょっと待て。この方法、超めんどくない？？？ 僕がやりたいの、文字を真ん中寄せにしたいだけで、後はそのままで良かったのに。。。。見た目の変わり様に、散髪屋さんで勝手にイメチェンされて「あ、これしか出来ないで」って言われた気分だ。

2. （ちょっとお手軽）tableView(_:willDisplayHeaderView:forSection:)を使って変更する

そう、元から「少しだけ変更したい」ってこともあると思う。そうゆう時はtableView(_:willDisplayHeaderView:forSection:)を使う。 呼び出されるタイミングは「SectionのView(Header,Footer)が表示される直前」です。呼び出し時に渡されるwillDisplayHeaderViewをヘッダーのViewとして、変更したいとこだけカスタムして上げて！

class ViewController: UIViewController, UITableViewDelegate {
    ...(省略)...

    //SectionのView(Header,Footer)が表示される直前にコールされる
    override func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
        let header = view as! UITableViewHeaderFooterView
        header.textLabel?.textAlignment = NSTextAlignment.center    //表示を真ん中にする
    }
}

結果はこうなりました。

そう、これでいいのよ。

3. まとめ

やりたいことを実現する方法って複数ある場合が多いですが、その時の自分に適した方法をちゃんと選ばないとコストかかりますってことですね。
後、Delegateメソッドって少し書き始めただけでXcodeの補完機能でバーっと一覧で名前が見えるんで、その名前から機能を推測して使ったりとか意識低めでいいんじゃないでしょうか。