Mark L Mark L - 4 months ago 13
Swift Question

Swift - constraint issues with UIScrollView (programatically)

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

Here's an image below. (I apologize for the link, I don't have enough points to show it in the post)

http://i.stack.imgur.com/gQ0SC.png

(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!

Answer

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.