Search code examples
iosobjective-cswiftuiscrollviewautolayout

UIScrollView AutoLayout Vertical Only

I want to get the AutoLayout working with the UIScrollView and am having a little trouble with it. Here is what I did:

  1. Add a UIScrollView inside the Main View with frame: [top: 0, left: 0, width: 320, height: 568]

  2. Add UIView "ContentView" inside the UIScrollView with frame and bgcolor black: [top: 0, left: 0, width: 320, height: 568]

  3. Setup UIScrollView constraints: [top: 0, bottom: 0, left: 0, right: 0]

  4. Setup "ContentView" constraints: [top: 0, bottom: 0, left: 0, right: 0]

  5. Align the items inside the "ContentView"

  6. Set Main View bgcolor to gray (to see what's going on)

Here is a screenshot of the problem:

Screen Shot1

For some reason, the constraints make the content view be in the middle of the screen. Also, it scrolls in every direction. I want the content to be scrollable only in vertical direction like in UITableView. so that I can't move it like below:

Screen Shot

What am I doing wrong? I have checked all the tutorials and answers I can find in StackOverflow and Google, and no one actually has just a bizarre problem, so I am asking for help.

EDIT: I also added ContentView's width and height as constraints and that didn't help either.

Solution

  • For disabling the horizontal scroll, you can set the content size in the (void)scrollViewDidScroll method.

    [self.scrollView setContentOffset: CGPointMake(0, self.scrollView.contentOffset.y)];

    You'll also want to set the directional lock so only 1 scroll direction is used at a time. https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIScrollView_Class/index.html#//apple_ref/occ/instp/UIScrollView/directionalLockEnabled

    self.scrollView.directionalLockEnabled = YES;