Example
Simple steps to use scrollview with autolayout.
- Create a new project with single view application
- Select the default viewcontroller and change its screen size to iPhone-4inch from attributes inspector.
- Add a scrollview to your viewcontroller's view as follows and set background color to blue
![enter image description here](http://i.stack.imgur.com/8TeQg.png)
- Add constraints on it as shown in below image
![enter image description here](http://i.stack.imgur.com/dgQtO.png)
What this will do is,simply stick every edge of scrollview to viewcontroller's view
Scenario 1:
Now lets say our content is huge,and we want it to scroll horizontally as well as vertically.
For this,
- Add a UIView to the scrollview of frame(0,0,700,700).Lets give it orange background color to identify it differently.
![enter image description here](http://i.stack.imgur.com/Htt43.png)
Next comes the important part,we need it to scroll horizontally and vertically.
Let me explain what we did in above step.
- We fixed the height and width to 700.
- We set trailing space to scrollview = 0 which tells the scrollview that content is horizontally scrollable.
- We set bottom space to scrollview = 0 which tells the scrollview that content is vertically scrollable.
Now run the project and check.
Scenario 2:
Lets consider a scenario where we know that content width is going to be same as scroll width width,but height is larger than scrollview.
Follow the steps to scroll content vertically.
- Delete the width constraint in above case.
- Change the width of orange view to match to scrollview width.
- Ctrl-drag from orange view to scroll view and add equal widths constraint.
![enter image description here](http://i.stack.imgur.com/p3e4G.png)
- And Done!!! Simply run and check if it scrolls vertically
Scenario 3:
Now we want to scroll only horizontally and not vertically.
Follow the steps to horizontally scroll the content.
- Undo all the changes to achieve constraints as below(i.e restore original constraints which achieved vertical and horizontal scroll)
![enter image description here](http://i.stack.imgur.com/QrjXr.png)
- Check frame of orange view,which should be (0,0,700,700)
- Delete height constraint of orange view.
- Change the height of orange view to match the scrollview height.
- Ctrl-drag from orange view to scroll view and add equal heights constraint.
![enter image description here](http://i.stack.imgur.com/7obqK.png)
- And Done!!! Simply run and check if it scrolls vertically