LoginSignup
2
1

More than 5 years have passed since last update.

[iOS] AutolayoutでLabelを揃えて配置する一つの方法

Posted at

いろんなやり方があるかと思いますが、AutolayoutでLabelを揃えて配置する一つの方法です。
忘れがちなので、自分用にメモ。

バージョン

Xcode8.2.1

前準備

右ペインにPreviewを出しておくと確認しやすいです。
また、デバイスを追加する場合は、青丸の+ボタンで追加します。

preview.png

ラベルを中心に配置する

Horizontally in center/ Vertically in center をチェックして制約を追加する。
動かない場合は、UpdateFrameをする

center.png

ラベルを追加してトップの中心に配置する

Add New Alignment Constraints > Holizontally in center をチェックして制約を追加する。

Labelを選択した状態で、Controlで上にハンドルを伸ばして、Vertical Spacing to Top Layout Guideをチェック

UpdateFrameをする

toplabel.gif

ラベルを追加してボトムの中心に配置する

Add New Alignment Constraints > Holizontally in center をチェックして制約を追加する。

Labelを選択した状態で、Controlで下にハンドルを伸ばして、Vertical Spacing to Bottom Layout GuideVertical Spacing to Bottom Layout Guideをチェック

UpdateFrameをする

buttom.gif

トップラベルの下に中央揃えでラベルを追加する

Add New Alignment Constraints > Holizontally in center をチェックして制約を追加する。

Labelを選択した状態で、Controlで上のラベルにハンドルを伸ばして、Vertical Spacing をチェック

UpdateFrameをする

next.gif

コーナーにラベルを配置する

Labelを選択した状態で、Controlで横にハンドルを伸ばして、Leading Space to Container Margin をチェック

Labelを選択した状態で、Controlで下にハンドルを伸ばして、Vertical Spacing to Bottom Layout Guide をチェック

UpdateFrameをする

corner.gif

2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1