自分がAuto Layoutを使ってみた感じでは、回転なしの基礎的なことを習得してプロジェクトに使えるようになるのに6時間位は使ってしまって、これは勉強するの無駄じゃないのって気もしないでもないので折角なら忘れないようにおさらい。
Auto Layoutの使いどころ
Auto Layoutは画面サイズによって複数のUIコンポーネントの座標値がそれぞれ微妙に変化する場合に使える。画面デザインによるが、それ以外はAuto Reisizeと自前での座標値計算を行うことでなんとかなる事が多い。
また、回転を考慮する場合もAuto Layoutのほうが楽かもしれない。
Auto Resizeのできること
Auto Resizeは親Viewからの相対的な位置と大きさの自動的な適用ができる。
例えば
- 画面の下にToolBarを固定することが出来る
- UITableViewCellのなかで画像位置を固定する
など
Auto Layoutのできること
Auto Layoutは親Viewや同階層のViewからの制約をつけることで位置を変更できる。
例えば
- 画面の下にToolBarを固定することが出来る
- UITableViewCellのなかで画像位置を固定する
- 水平方向や垂直方向にViewをセンタリングできる
- 2つのコンポーネント間の位置制約として<=や>=のような制約もできる
2つのコンポーネント間の位置を動的に配置したい（<=や>=で決めたい）場合はRelationで"Greater Than or Equal"や"Less Than or Equal"を指定する。
Auto Layoutでハマった時の解決法
見直しリスト
- Viewのサイズも制約に与えてみる（frameの値と同じにしてみる）
- 先に固定位置のコンポーネントから制約を与えて石橋を叩きながら進める
- Space Containtで=だけでなく<=や>=を使う時は特にエラーが出やすい
- 位置情報を決定するための条件がまだ抜けている
- 全ての条件（サイズや固定値との接続）を見直していくと一気に解決する
見直しのための覚書
2つのViewの距離感に<=や>=を使う場合が結構わかりづらい。
例えば、AとBのViewががあっとして、AとBの垂直方向の距離Lを
3.5inchディスプレイならば6ptになり、
4inchディスプレイなら20ptになるようにしたいとき、
Space Containtで6<=L<=20とする（Greater Than Equalが6でLess Than Equal が20）。
このとき、Aのy座標値は制約として固定されていないとBの位置が決められないために6<=L<=20を設定してもAmbiguity（不定）になる。逆にBが決まっている場合ならそれでいいが、Bが決まっていないとAmbiguityになる。決められる部分を決めていくとAmbiguityが無くなるので、そこから動的に変わる部分をいじっていく。
さらに具体的な例
次の図に例としてタイトルラベル、アーティストラベル、UIImgeView、iTunesで探すボタンと下にToolBarなどがある構成をあげる。
左が4inchで、右が3.5inchで4inchのときは余白をなるべく分散するようにしたい。
ナビゲーションバーとタイトルの間を2<=L<=10のように動的にした時、まずエラーになる。解決するため水平位置をどうするかを決め、それからタイトルとアーティストの距離を決める。
アーティストの位置が固定であればそれで終わりだが、アーティストの位置もUIImageViewの位置との制約があるので同じように6<=L<=20とする。UIImageViewの位置が固定だったら終わりだが...という風に繰り返していくと最後に全てのAmbiguityが消える。
まだ飲み込めてないこと
- Viewのサイズも制約で大きくしたり小さくしたりできるんだろうか
- placeholderのサイズ指定がどのように効果的なことになるのか
- 回転させるときどうやるのか
参考
Apple公式: Auto Layout（PDF）
https://developer.apple.com/jp/devcenter/ios/library/documentation/AutolayoutPG.pdf
Developer.IO 特集カテゴリーXcode 5 / Auto Layout
http://dev.classmethod.jp/referencecat/xcode-5-auto-layout/
iOSアプリを作ってみる (8) - Autolayoutに振り回される その1
http://deutschina.hatenablog.com/entry/2013/09/16/164838