XcodeのAutoLayoutを振り返る
こんにちは！先週からCyber-ZのOPENRECという部署でiOSエンジニアインターンを始めたシェンタです。
OPENRECではコードもちょこちょこ書きますが、UIの改善が多くて先日上司の方に UIの改善 を頼んだと言われてこれまでノリでやっていたAutoLayoutについて少し勉強しようと思いこの記事を書きました。
それでは早速めんどくさいAutoLayoutについて書いていきます。笑
AutoLayoutとは
まずAutoLayoutとは？という方もいるかもしれませんが、AutoLayoutとはXcodeの標準の機能で全端末でレイアウトを綺麗に見せる（同じレイアウトにする）制約みたいなものです。
制約の種類
AutoLayoutには制約の種類がいくつもあります。この制約を上手く付けてあげる事によっていい感じに全端末で表示させる事ができるという訳です。それでは制約の種類を見ていきましょう
Add New Constraints
Add New Constraints
上下左右のUIパーツ間の距離の制約をつける
Width
UIパーツの幅を固定
Height
UIパーツの高さを固定
Equal Width (あんまり自分は使わない)
複数のUIパーツの幅を固定する
Equal Height (あんまり自分は使わない)
複数のUIパーツの高さを固定する
Aspect Ratio (自分はよく画像の比率とかを固定するときに使う)
UIパーツの縦横比を固定
Add New Aligment Constraints
Leading Edges (Edges系は自分はあんまり使わないけど便利そう)
複数のUIパーツを左端揃えする
Trailing Edges
複数のUIパーツを右端揃えする
Top Edges
複数のUIパーツを上端を揃えする
Bottom Edges
複数のUIパーツを下端を揃えする
Holizontal Centers(ここは複数のUIパーツを同じx軸とかy軸で見せる時とかに使ってそう)
複数のUIパーツを横方向に中心揃えする
Vertical Centers
複数UIパーツを縦方向に中心揃えする
Baselines
複数のUIパーツのベースラインを揃える
Horizontal Center in Container(この辺はよく使う)
Viewの中心を0としてy軸の位置の制約をつける
Vertical Center in Container
Viewの中心を0としてx軸の位置の制約を使う
最後に
こんな感じでしょうか、試してみた的なのは今度時間があるときにまた記事にしようかと思います。自分で触ってみるのが一番早いので色んなパターンを試して、AutoLayoutを是非楽しんでください！！
