Swiftのカスタムセルの基本の基 #Swift

Swiftのカスタムセルの基本の基

Swiftのカスタムセルをなんとなく利用していましたので、自己理解のために基本の基本をここで改めてまとめておこうと思います。

そもそもカスタムセルとは

UITableViewの一つ一つを表示するセル部分を表示するのが「UITableViewCellクラス」になります。

XCodeの方ではシンプルなUITableViewCellのデザイン・構成が元から準備されています。

しかし、元から準備されている構成では表現したい内容が異なる場合など、オリジナルの構成を作りたい場面が多くあります。
その様な際に作成できるのがカスタムセルで、UITableViewCellクラスを用いて自身の好きな様に見た目・内容をカスタムして利用することができます。

カスタムセルの時はxib化がおすすめ

UITableViewCellのカスタムをStoryboardのUITableView上に直接配置し利用することが可能です。

しかし、別画面で流用などができず、同様のセルを利用したいときは都度UITableViewCellのカスタムを作成しなけれないけなくなります。
DRY原則に従うためにも、流用できる形でセルを作成できた方が効率的です。

その、「流用できる形で作成できるカスタムセル」を作る方法が「xib化すること」です。

※DRY原則:Don't Repeat Yourselfの略。コード・情報を「繰り返しを避ける・重複を避ける」ことを意味します。

xib化とは

作成するUITableViewCell単体のxibファイルを作成し、それを利用することです。
※詳細の作成方法は割愛

xib化したUITableViewCellのメソッド

func awakeFromNib()

StoryboardまたはnibファイルなどでCellがロードされた直後に呼ばれるメソッド

func setSelected()

セルがタップされ、選択状態/通常状態が切り替わるときに呼ばれる処理メソッド

カスタムセルの高さを可変式にする際のポイント

初期設定ではセルの高さは固定されています。
Tableviewのメソッドで高さを指定しても、全てのセルが同一の固定値で指定されてしまいます。
そこで、以下の方法を使えばセルの内容に合わせてセルの高さを可変式に変更することができます!

・UITableView内のレイアウトで縦軸の全てにAutoLayoutを設定する
（CellのTopからBottomまで間にあるtextviewやbottonなど全て漏れなく上下AutoLayoutを設定してください。固定にしたいパーツは高さを固定値に、可変式にしたいパーツは高さを設定しないでください）

・TableViewに想定値を設定する
（必須ではない。事前に想定の高さがわかるこおでcellの処理が早くなるらしい）

override func viewDidLoad() {
      super.viewDidLoad()
      tableView.estimatedRowHeight = 50
      tableView.rowHeight = UITableViewAutomaticDimension
}

・tableviewでheightの指定をしない
以下のメソッドで高さを指定できますが、固定値になってしまうのでこのメソッドを利用しない様にしましょう

//これを設定しない!!
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return 10
    }

まとめ

・xib化してカスタムセルを作成しましょう
・xib化した時は、最初から2つメソッドがあるので、必要に応じて利用しましょう。
・高さを可変式にしたい時は、可変式用の設定をしましょう。