Help us understand the problem. What is going on with this article?

UIScrollViewとUINavigationBarがずれた時の対応

More than 3 years have passed since last update.

現象

UINavigationBarがあるViewControllerにScrollViewを全画面で置いて、
UIコンポーネントを置いていきました。
しかしStoryBoadの表示位置とビルドした時のiPhoneの画面がどうしてもずれる。
その解決方法を調べました。

UIコンポーネントの階層は

  • View(rootView)
    • ScrollView
      • View(コンテンツビュー)
        • IBコンポーネント(実際に配置するコンポーネント)

(20150719日追記)

AutoLayoutの設定はVisual Format Languageで表すと

  • H:|-(-16)-[ScrollView]-(-16)|
    • ScrollViewの水平位置はrootViewの左右の端(左右は16ポイントのマージンがあるので-16を指定)
  • V:|-[ScrollView]-|
    • ScrollViewの垂直位置はrootViewの上下の端
  • |-[View(600)]-|
    • コンテンツビューはScrollViewの上下左右の端。そして高さ横幅600ポイント
  • H:|-8-[Label]|
    • ラベルは左端から8ポイント離れる
  • V:|-153-[Label]|
    • ラベルは上から153ポイント離れる

スクリーンショット 2015-07-13 17.50.25.png

Storyboad上ではナビゲーションのすぐ下にラベル「IBと表示位置が違う」を配置しました。

アプリを実行した際の表示

iOS Simulator Screen Shot 2015.07.13 17.54.47.png

実行した際のレイアウトはラベルがナビゲーションのかなり下に来てしまいました。
(ナビゲーションと同じ距離離れている??)

解決方法

ViewControllerのAttributesInspectorにある
Layout > Adust Scroll View Insets
をオフにするとIBでの表示と同じになりました。

スクリーンショット 2015-07-13 18.12.29.png

 Adust Scroll View Insetsをオフにしてのアプリ実行表示

iOS Simulator Screen Shot 2015.07.13 17.54.33.png

仕組み

Adjust Scroll View InsetsとUnder Top Barsの両方にチェックをした場合に
contentInsets.topが調整されて
UIScrollはナビゲーションバーの下から始まるようです。
なので、Adjust Scroll View Insetsはオフにしたほうがいいようです。

参考

やはりお前らのiOS7対応は間違っている(解説編)
http://qiita.com/yimajo/items/254c7cebab7864678246

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした