Swiftで遊ぼう！ - 215 - Developing iOS 8 Apps with Swift - More Xcode and Swift, MVC - レイアウト

Swiftで遊ぼう！の古い記事-> Life-LOG OtherSide

講義IIの最後のトピックはAutolayoutだ。実はこのオートレイアウトの説明は一度で終わらない。今後少しずつ説明が加えられていくようだ。

今日のオートレイアウトのテクニックは、ここで説明したフィリングのテクニックを使っている。

View上に並べたボタンを全て選択した状態が以下のようになっていると思う。ちょっと違うって?　じゃあしっかり講義を見てて下さい。

1番右の列、上から3つのボタンはタイトルが無いですよね。これがフィリングとして働くということですね。

ボタンの配置はHIGの規定に基づいて並べられているけど、左下隅が空いてますよね。

ここを埋めるために「0」ボタンをOpt + ドラッグ(コピー)して左の隅に埋めましょう。

当然タイトルをダブルクリックして消去!　これだけではボタンの関連づけを切ることができないので、右クリック、もしくはControl + クリックしてください。

メニューからTouch Up Insideを消去すれば白紙ボタンになります。

フィリングの用意もできたので、すべてのボタンを選んだ状態で、下の「Pin」メニューから選んで図のごとく、ボタンの高さと幅を一致させ、上下左右の感覚を8ポイントで整列させるメニューを選んで、コンストレイントを設定してください。

イエローラインが滅茶多いですよね。

でも御心配なくイエローラインは位置がずれているという警告でレッドラインと意味が異なります。

ドキュメント・アウトラインの警告マークをクリックすると...

あるあるイエロー警告、位置ずれの警告です。

警告をクリックすれば、メニューが出てくるのでUpdate　Frameを選んで下さい。

当然、すべての警告に適応させればいいですね。

これで警告のすべてが解消されている。

ほら上手くいっているでしょ。もしコンストレイントを競ってしてレッドラインが出ていればUpdate Frameで修正は効かないだろう。最初っからやり直した方がいいと思う。

ということで今日は終わり。