「iOSのレイアウトサイクルを知ろう」のメモ
この勉強会 のメモです。
概要
レイアウトはコストが高い
レイアウトは必要最低限に抑えたい
意図しない場所で再レイアウトは起こしたくない
サイクルが回らないとレイアウトが想定通りにならない
レイアウトサイクルは layout runloop に該当する
https://gyazo.com/a5485f7b0476e9412307419738e4e5a7
Needs layoutの判定規準
setNeedsLayout() を呼び出した時
デバイス回転
子ビュー更新
自ビュー階層内の制約更新
UIScrollView である子ビューがスクロールした
自分の子ビューの frame や transform 等が変更された時
どうレイアウトすればよいのか
UIView の layoutSubViews をオーバライドし、その中身でレイアウトあ売れば良い
ビューの frame プロパティーは親が管理
内容に応じてサイズが変わる時は sizeThatFits でなんとかなる
例: label.frame.size - label.sizeThatFits(bounds.size)
サイドレイアウトが必要になったら setNeedsLayout を呼ぶ
注意点
レイアウト (に限らずUI系全般) はメインスレッドで!(予想と違う挙動になる)
レイアウトサイクル内でレイアウト引き起こさない (意味がなかったり、永遠にサイクルが終わらなかったりする)
レイアウトサイクル内で ( setNeedsLayout や setNeedsUpdateCnstraints を呼ばない)
レイアウトサイクルの呼び出しをなるべく最小限に
子ビューの追加はなるべく viewDidLoad か viewWillLayoutSubviews 内で行う
layoutIfNeeded をむやみに呼ばない ( アニメーションブロックは大丈夫 )
注意点(コード)
sizeThatFits を上手く活用し、レイアウト処理を最小限に抑える
sizeThatFits のオーバライドするときに、中身でなるべくレイアウト処理させない
自分自身で自身の frame 等を変更しない ( 親がやるべきこと )
注意点(AutoLayout)
ビュー関係を活用して制約を組む
関係性を正しく設定できていれば setNeedsLayout() layoutIfNeeded() のコンボは要らない
制約の更新頻度をなるべく最小限にする
可能な限り制約を流用し constants を変更するか、制約を isActive で切り替える
isActive で切り替える場合は制約の保持に注意 (メモリから制約が消える)
NotAutoLayout
Layout用のライブラリ、AutoLayoutが必要無い
https://qiita.com/lovee/items/7454c9f27638a8e471fa
メモ
レイアウトサイクル考えたこと無かったので学び直す必要ありそう
データ反映箇所を考え直したほうが良いかも (VCサイクルにおいて)
Viewの親子関係大事
質問
Storyboadは使わない方が良い?
個人的には使わない。ハッカソンでは使う。Storyboadのメリットはプロトタイプを作りやすい。
世の中の主流では6, 7割以上使われている。
デメリットは複数人でStoryboadを更新するとコンフリクトしやすい。
画面ごとにStoryboadを分割したらInterfaceBuilderと何が違うの?ってなる
仕様変更のときに辛くなる、コピペも出来ないし作り直さなきゃいけない。
制約も作り直さなきゃいけない、そう考えるとコードで書いた方が楽。
レイアウトはVCに書いて良い? (クラス分ける?)
cocoaMVCをそのまま使っていればVCに直接書いても良い。
複雑になってきたらInterfaceBuilderでViewを作ったほうがレイアウトコードをViewに切り出せるので良い。
StoryboardのSegueは闇しか無い。
myViewのlazyは何故必要?
VCの生成コストを下げる為 (Viewの生成コストは高い)
必要になったらViewを生成させたほうが良い。
Segueの子ビューは最初は生成されて無い、loadViewした後に出るのでオプショナルになっている。
Storyboardでnilにして必要な時に生成され、Swiftはlayzにして必要な時に生成してる。
スライドの配布はあるか
https://speakerdeck.com/lovee/iosfalsereiautosaikuruwozhi-rou
何をみて勉強すれば良い?(本とかサイトとか)
Apple公式が一番良い。
公式読んでわからなかった時はxcodeで雛形を作ってみる。
各レイアウトサイクルのメソッドをオーバライドし、中でデバッグコメントを出力してタイミングを調べる。
https://classmethod.connpass.com/event/81032/ らへんにある資料も参考になる。
AutoLayoutについて
Viewの階層からやると分かりやすい
ラベル1とラベル2がある場合、ラベル1をViewに合わせて中心に配置する Center Horizontally in Safe Area 等で
ラベル2はラベル1のすぐ下にあるので、ラベル1に合わせてスペースを設定 Vertical Spacing
画面右側の Show the size Inspector で制約の設定を行う
Aspect Ratio を使ってパーツのアスペクト比を設定出来る
上から何%の時は Top Space to Safe Area でやると良い
メモ
レイアウトフレームワークを導入すると良い
MisterFusionは後々辛い