Auto Layoutについてちゃんと理解したかったので、チュートリアルをやってみました。
- Beginning Auto Layout Tutorial in iOS 7: Part 1 | Ray Wenderlich
- Beginning Auto Layout Tutorial in iOS 7: Part 2 | Ray Wenderlich
最終的に、こんなレイアウトをAuto Layoutで作るところまでやりました。コードで作るところまでは含まれていませんでした。チュートリアルは、そのとおりにやっていけば必要な操作を一通り体験できるので非常にためになりました。ちょっと長めだし英語なのですが。ただ、これをクリアすれば「Auto Layoutの基本的な部分は押さえた！」って気持ちにはなれます。
Auto Layoutはデバイスの画面サイズに影響されない画面を作ることができるので本当に便利ですね！！！更に、Xcode5になって勝手に不要なconstraintsができない等格段と使い安くなっている様子です。以下、勉強になったことを列記していきます。
Auto Layoutが良い点
- デバイスの回転に簡単に対応できる
- 異なる画面サイズの端末にも簡単に対応できる。
- 基本的な処理に関しては覚えることは意外と少ない。
制約について
以前の絶対座標をframeにセットする方式と違い、Auto Layoutはビューの制約(constraint)を追加してゆくことで画面表示を作成していきます。それが、次の言葉を読んでそれがすっと入ってきました。
A constraint describes a geometric relationship between two views.
「制約(constraint)は２つのviewの位置関係を説明するものです。」というような意味の文です。２つのビューの関係とは、
- parent view とchild view（viewとそれにaddされたview）
- 同階層のview Aとview B（sibling）
- view A と view A（自分自身との関係）
Design by intent
「意味によってデザインする」という約になるのでしょうか。frameによってのデザインとの違いが以下のように説明されています。
When you design by intent, you’re expressing what you want to accomplish but not necessarily how it should be accomplished. Instead of saying: “the button’s top-left corner is at coordinates (20, 230)”, you now say:
“The button is centered vertically in its superview, and it is placed at a fixed distance from the left edge of the superview.”
「意味によってデザインするときには、達成したいものを表現します。必ずしも達成するための方法が必要なわけではありません。『ボタンの左上の角はxが20でyが230です』と言う代わりに、「ボタンはsuperviewの上下中央に位置し、superviewの左端に固定されています」と言うのです。」
訳がうまく行きませんでしたが、座標を指定するのではなく、他のビューとの関連の中でそのビューが本来位置するであろう位置を指定してゆくことになるのだと思います。
同階層のビュー間の調整
- Compression Resistance Priority : 小さくなりやすさ
- Content Hugging Priority : 大きくなりやすさ
同階層のビューのサイズが変更されるときに、大きくなりやすさや小さくなりやすさを調整することでお互いのビューのサイズ調整がスムーズに行われます。勉強になりました！
