Swift - constraint issues with UIScrollView (programmatically)

Question

I recently added a scrollview to my viewcontroller. However, this caused my layout to mess up completely.

Here's an image below.

(I gave the UIScrollView a temporary red background, to display, that it's clearly taking the full screen)

now. I have a bunch of things in this view. But to keep it simple I will focus on the top blue bar, which in my app is called "topBar"

First of, I define it in my class.

var topBar = UIView()

I remove the auto sizing, give it a color and add it to my scrollview.

//----------------- topBar ---------------//

    topBar.setTranslatesAutoresizingMaskIntoConstraints(false)
    topBar.backgroundColor = UIColor.formulaBlueColor()
    self.scrollView.addSubview(topBar)

add it to my viewsDictionary:

var viewsDictionary = [ "topBar":topBar]

add the height to my metricsDictionary:

let metricsDictionary = ["topBarHeight":6]

set the height in a sizing constraint.

//sizing constraints
    self.scrollView.addConstraints(
        NSLayoutConstraint.constraintsWithVisualFormat(
            "V:[topBar(topBarHeight)]", options: NSLayoutFormatOptions(0), metrics: metricsDictionary, views: viewsDictionary))

And finally the part that doesn't work. I /attempt/ to make it the full width of "scrollView"

// Horizontal Constraints
    self.scrollView.addConstraints(
        NSLayoutConstraint.constraintsWithVisualFormat(
            "H:|[topBar]|", options: nil, metrics: nil, views: viewsDictionary))

and my vertical constraint to put it at the top.

// Vertical Constraints
    self.scrollView.addConstraints(
        NSLayoutConstraint.constraintsWithVisualFormat(
            "V:|[topBar]", options: nil, metrics: nil, views: viewsDictionary))

Now as for my scrollview, (the one that's probably causing my layout headaches)

It's set up as follows:

as the very first thing in the class:

    let scrollView = UIScrollView(frame: UIScreen.mainScreen().bounds)

first thing in my viewDidLoad()

self.view.addSubview(scrollView)
    scrollView.setTranslatesAutoresizingMaskIntoConstraints(false)
    scrollView.scrollEnabled = true

and lastly my viewDidLayoutSubviews.

    override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    scrollView.frame = view.bounds
    scrollView.contentSize = CGSize(width:2000, height: 5678)
}

^ The width of the contentSize will be changed to the width of the screen (I only want vertical scrolling). But right now that's a minor issue compared to the layout problems I'm having

Any help as to why everything is squeezed together would be greatly appreciated!

Mark L Mark L · Accepted Answer · 2015-03-18T10:27:25

I managed to fix it doing the following.

Defining my contentsize in viewDidLayoutSubviews

    override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    scrollView.frame = view.bounds
    scrollView.contentSize = CGSize(width:self.view.bounds.width, height: 5678)
}

and instead of making the view equal to a scrollview, I had to make it a subview of it.

I also had to make a subview of the scrollview, for all my content to work with constraints properly.

    self.view.addSubview(scrollView)
    scrollView.translatesAutoresizingMaskIntoConstraints = false

    contentView.translatesAutoresizingMaskIntoConstraints = false
    scrollView.addSubview(contentView)

and all my other objects was made subviews of the "contentView" and not the scrollview.

Swift - constraint issues with UIScrollView (programmatically)

1 Answers