119
123

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

AutoLayoutで画面の大きさに比例してViewの大きさを変えたい

Last updated at Posted at 2014-11-29

例えばデバイスの幅が1000pxだった時、Viewの幅は500px(50%)にしたい、という場合です。

AutoLayoutを始めて「これくらい当然できるでしょふふーん」と思っていじってみたけど、全然出来る気配がなくて、結局泣きながらコードと併用して対応したというお話です。

って、実はStoryboardエディタだけでできるのでしたら教えてください。

=====
追記
2014/11/30 3:56 できました

Multiplierを使います。(いままでお試しでしか使ってなくて忘れていた・・・)

親をSuperviewとかにして、一度EqualWidthをつけたあと、Multiplierに0.5と入れると50%になります。こんな感じです。

スクリーンショット 2014-11-30 3.55.34.png

まあ、ConstraintをIBOutletで引っ張って云々できる、というのは知っていて損がないので、それはそれ、これはこれで!

=====

結論からいうと単純ですが、Height EqualやWidth EqualのConstraintをIBOutletでつないで、その値をいじってしまえ、ということです。

例えばこういうStoryboardがあって
スクリーンショット 2014-11-30 2.11.31.png

こういう風につないで
スクリーンショット 2014-11-30 2.16.31.png
(わかりづらいですが、HeightとWidthをつないでます)

こういうコードを書くと
スクリーンショット 2014-11-30 2.16.42.png

4sだとこうなって
スクリーンショット 2014-11-30 2.21.47.png

5sだとこうなって
スクリーンショット 2014-11-30 2.21.59.png

6plusだとこうなります
スクリーンショット 2014-11-30 2.35.05.png

ステータスバーやナビゲーションバーの分ずらしたりはお好みに応じてどうぞ。

119
123
3

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
119
123

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?