画面構成
正面図
立体図
セルの構成
背景のUIView
- UIView①を背景と見立てて、上下左右にAutoLayoutをつける
- これにより、セルとセルの間に余白ができる
- また、UIView.layout.cornerRadiusを調整することで角丸にできる
UIViewの中のUIView
- 複数の画像の位置を調整するときは、UIViewのなかに入れ込むのが良い（図ではUIView②のなかにUIView③を入れている）
- この構造を親子関係と言う（図では②が親、③が子）
- UIViewの位置をコードで調整するときは、*UIView.frame = CGRect(x: 8, y: 8, width: 45, height: 45)*などで調整できる
- CGRectはUIViewの位置をを調整できる
- この関数はAutoLayoutよりも優先されるので、storyboardで設定した制約を上書きしてしまうため、扱いには注意が必要
- パラメーターはx, y, width, height
- 例えばこの記事では、ラベルに代入される値に応じて、赤黄青のViewの位置を変えている
なぜUIViewのなかにいれる？
- UIViewのなかに入れることで、バラバラなViewを１つのグループとしてまとめることができる
- 親子関係になったパーツは位置の基準が親のViewの位置になる
- storyboardから、そのパーツの位置は数字で確認できる
セルの更新について
- 画面が読み込まれたタイミング（viewDidload）では、セルの中身はstoryboardによって決められているので、このままではコードによってセルの内容を制御できない
- これを解消するためには、viewDidAppearと言う関数を用いて、tableの内容をreloadする
hoge.swift
override func viewDidAppear(_ animated: Bool) {
table.reloadData()
}
- viewDidAppearは、全ての画面のレイアウトの処理が正常に終わった後、呼ばれる関数
- viewDidloadとかviewDidAppearは書けば自動的に呼んでくれるが、呼ばれる順番は決まっているので、詳しくはUIViewControllerのライフサイクルを参照
- *reloadData()*はUITableViewの関数
- セルの内容を更新し、表示する内容を変更したいときはこの関数を呼ぶとUITableViewをリロードして、値を更新してくれる
改めて完成図