［iOS］AutoLayoutでWarningを出さない３つの事

皆様はじめまして。

InagoraのiOSエンジニアの仁科です。社会人２年目で、Objective-Cを学んで１年になります。

 

「WONDERFULL」の画面では大体Storyboardを使って画面を作成しています。

AutoLayoutは奥が深くて、まだまだ慣れないところは多々ありますが、綺麗にレイアウトを作る上での意識を紹介していきたいと思います。

1.    デザインをよく確認する

「WONDERFULL」のアプリのデザインでは、Sketchを採用しています。

もらったSketchを元にStoryBoardを作成していきます。

大事な点は、上から配置していき、View同士のマージンをよく確認することです。

 

よくやってしまうのが、Viewをマウスで動かして配置を決めようとすると、Xの値が8とかになってしまったりしてしまいます。

気づかないでそのまま進めてしまうと後々微調整が大変になってきたりするので、しっかり確認しましょう。

 

2.  AutoLayoutは一番最後

Sketchでデザインをよく確認し、Storyboardで位置を決定していきます。

この時、全て変更があるパーツは全て制約を外します。（縦、横の制約も一旦は外します。）

 

デザイン通りの配置にして初めてAutoLayoutをいじります。

AutoLayoutを設定する際も、上のパーツから順に設定する事を意識します。

横に並んでいるViewだったら左から設定しましょう。

 

制約を設ける上で大切なのは、位置を決定しなければならない箇所から設定する事です。

 

3.  update Frame, update Constraintsを駆使する

AutoLayoutを設定してから位置を微調整したとき、必ずWarningが出ます。そのときは全て修正するパーツの位置変更を行ってから、

必ずupdate Constraintsをしましょう。

 

まだ気をつけなくてはならないことが多々ありますが、これさえ守っていればある程度のWarningは防げます。

AutoLayoutにくじけないでがんばりましょう！