Scrollview with navigation bar + auto layout

I have a ViewController built into the NavigationController. I placed the ScrollView inside it, then looked at the content covering the entire area (to set the size of the ScrollView content) and some labels. I tried to set limits for all controls, but I failed.

Here's what it looks like in Xcode:

Xcode view

And this is in Simulator:

View Simulator

Red is the scroll view, green is the content view. Of course, I can scroll the view to get the bottom mark on the screen.

What have I done wrong? What are the appropriate restrictions? Of course, I want ScrollView to cover the entire useful area of ​​the window (from the bottom of the navigation bar to the bottom of the screen).

For full reference, you can download the project .

+8
source share
4 answers

Swift 3:

self.automaticallyAdjustsScrollViewInsets = false 
+6
source

I think the gap you see is caused by the navigation bar. The gap is equal to size 64, the size of which is the navigation bar + status bar (44 + 20). You need to limit the scrollbar to the top layout guide. Pressing this 64 is negative. So your constrolant scrollview will be -64.

This can also be done with one click by clicking the position view button in the size inspector in xcode.

Click on the position view and select the container to store vertically . This will limit the scroll guide in the top layout. Now select scrollview and click on the update restrictions in the storyboard.

enter image description here

As you can see, the contentView is not designed to cover the view just like a scrollview, there is a place on the content view button when the view is loaded, the navigation bar will take up additional space, and the content image will be exactly where you need it.

+3
source

Here's a good tutorial on scrollView and Auto Layout. I spend a lot of time with the same problem until I find this tutorial. http://spin.atomicobject.com/2014/03/05/uiscrollview-autolayout-ios/ .

The way is to drag scrollview and content information to the entire area, for example, if the navigation bar were not displayed. Also create the correct constraints.

+3
source

The script with fast 3 works, but the interface builder tries to compensate for the navigation bar, so when adding a view, ignore the panel and place the view above it. IB compensates.

0
source

Source: https://habr.com/ru/post/1240115/


All Articles