[XCode]入力フォーム画面にAutolayoutを設定する

3.Main.Storyboardにオブジェクトを配置する。

完成イメージのように部品を配置していく。
きっちり配置する必要はないがなるべく近いとこに配置した
ほうが後々設定に困らなくなる。
テキストエリアを左に寄せすぎるとiPhone8のレイアウトがはみ出すことが確認できる。
また部品を配置することで黄色の矢印が表示され警告が多数表示される。
これは制約を設定することでなくなっていくので今は気にしない。
警告詳細

4.Constraint(制約)を設定していく。

・ラベルを設定する

名前を選択して①をクリックする。
画像の様に「上に30の余白」、「左に10の余白」を入力する。
「Add 2 Constraints」をクリックする。
ニックネームを選択して①をクリックする。
 画像の様に「上に30の余白」を入力する。
 「Add 1 Constraints」をクリックする。
 ※左の余白は設定の必要はない
電話番号を選択して①をクリックする。
 ニックネーム同様に「上に30の余白」を入力する。
「Add 1 Constraints」をクリックする。
 ※ spacing to nearest neighborは隣接する部品を自動的に参照してくれる。
この機能を効率的に利用するため最初のオブジェクトの配置を
なるべく完成形に近い形に配置している。
メールアドレスを選択して①をクリックする。
 「上に30の余白」を入力する。
「Add 1 Constraints」をクリックする。
4つのラベルを「Cmmand」キーを押しながら複数選択する。
①をクリックして「Equal Widths」と「Equal Heights」にチェックをいれる。
「Add 6 Constraints」をクリックする。
続いて4つのラベルを選択した状態で①をクリックする。
「Horizontal Centers」にチェックを入れる。
「Add 3 Constraints」をクリックする。
ラベルのオートレイアウトの設定が完了。
次のページへ 

コメントする

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です