编程创建具有的UIScrollView和自动版式控制器无法正常大小的意见 [英] Programmatically creating controller with UIScrollView and AutoLayout is not sizing the views properly

问题描述

我想以编程方式创建，这将奠定了它在子视图可滚动的方式视图控制器。我试图用的UIScrollView使用自动版式，并阅读所有的技术说明，并因此在这方面的答案。但我不能得到这个权利 - 这似乎有一些细微差别WRT创建/使用或UIScrollView的，我很想念这里

I am trying to programmatically create a view controller which will lay out it subviews in a scrollable fashion. I am trying to use AutoLayout with UIScrollView and have read all the tech notes and SO answers in this regard. But I cannot get this right - it seems there is some nuance wrt the creation/usage or UIScrollView that I am missing here.

我的code是下方，我看到的是输出也是美元以下图片psented p $。

My code is below and the output that I see is also presented in pictures below.

我的意料的是，我会看到棕色和绿色条纹（子视图），将占据整个屏幕。我感到我必须指定子视图的高度，但我不明白为什么水平尺寸是行不通的。如果我不指定横向尺寸，我希望我的子视图得到拉伸占据屏幕的宽度，但它没有这样做。

My expectation is that I will see brown and green stripes (subviews) that would occupy the entire screen. I get that I have to specify the height of the subviews, but I do not understand why the horizontal sizing just does not work. If I do not specify the horizontal size, I would expect my subview to get stretched and occupy the width of the screen, but it does not do so.

这里的code为我的控制器。

Here's the code for my controller.

class ScrollableRowHeadersViewController : UIViewController {

var scrollView : UIScrollView!

override func loadView() {
    self.view = UIView(frame: CGRectZero)
    scrollView = UIScrollView()
    scrollView.setTranslatesAutoresizingMaskIntoConstraints(false)
    self.view.addSubview(scrollView)
    scrollView.backgroundColor = UIColor.blueColor()
    self.view.addVisualConstraint("H:|-0-[scrollView]-0-|", viewsDict: ["scrollView" : scrollView])
    self.view.addVisualConstraint("V:|-0-[scrollView]-0-|", viewsDict: ["scrollView" : scrollView])
    self.view.contentMode = UIViewContentMode.Redraw
}

//load all the subviews after the main view and scrollview loaded.
override func viewDidLoad() {
    var viewsDict = [String: UIView]()
    var vertical_constraints = "V:|"
    scrollView.autoresizesSubviews = true

    for i in 1...100 {
        var subview = UIView()
        subview.setTranslatesAutoresizingMaskIntoConstraints(false)
        subview.backgroundColor = (i%2 == 0 ? UIColor.brownColor() : UIColor.greenColor())
        viewsDict["subview_\(i)"] = subview
        self.scrollView.addSubview(subview)
        vertical_constraints += "[subview_\(i)(==50)]"
        self.scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[subview_\(i)]|", options: NSLayoutFormatOptions(0), metrics: nil, views: viewsDict))
    }

    vertical_constraints += "|"
    self.scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(vertical_constraints, options: NSLayoutFormatOptions(0), metrics: nil, views: viewsDict))
}

}

下面是设置于H水平约束的输出：| [subview_（I）] |

Here is the output with horizontal constraints set to H:|[subview_(i)]|

下面是设置于H水平约束的输出：| [subview_（I）（== 100）|

Here is the output with horizontal constraints set to H:|[subview_(i)(==100)]|

在这两种情况下，我会期望看到在屏幕的整个宽度交替棕色和绿色条纹。

In either case I would have expected to see alternating brown and green stripes across the entire width of the screen.

我在想什么？感谢您帮助。

What am I missing? Thanks in advance for helping.

推荐答案

在更加痛苦和紧密阅读，对于这种现象的原因，答案逐渐明朗。这也是很好的<一个描述href=\"http://stackoverflow.com/questions/16441808/uiscrollview-with-ios-auto-layout-constraints-wrong-size-for-subviews\">this SO质疑。我希望技术说明更英语，但@rdelmar和@Rob解释的很清楚，的内容查看约束用来设置滚动视图的contentSize 的。

After much more pain and reading closely, the reason for this behavior and the answer becomes clearer. It is also very well described at this SO question. I wish the Technical Note was more English, but @rdelmar and @Rob explain very clearly that "constraints on contentView are used to set the contentSize of the scrollView".

下面是修改code和结果（我认为这是正确的解决方案）。我的看法层次是现在这么：
的ViewController - >的UIView（MAINVIEW） - > UIScrollView中 - > UIView的（内容查看） - > UIViews（子视图）

Here is the modified code and the result (which I think is the correct solution). My view hierarchy is now such: ViewController -> UIView (mainView) -> UIScrollVIew -> UIView (contentView) -> UIViews (subviews)

有该内容查看和MAINVIEW之间的特宽幅的约束。此外，所有的子视图被添加到内容查看，而不是加入到滚动视图直接

There are extra width constraints between the contentView and mainView. In addition, all subviews are added to the contentView rather than being added to scrollView directly.

class ScrollableRowHeadersViewController : UIViewController {

var scrollView : UIScrollView!
var contentView : UIView!

override func loadView() {
    super.loadView()
    self.view = UIView(frame: CGRectZero)
    scrollView = UIScrollView(frame:CGRectZero)
    scrollView.sizeToFit()
    scrollView.setTranslatesAutoresizingMaskIntoConstraints(false)
    self.view.addSubview(scrollView)
    scrollView.backgroundColor = UIColor.blueColor()

    contentView = UIView()
    contentView.setTranslatesAutoresizingMaskIntoConstraints(false)
    contentView.backgroundColor = UIColor.redColor()
    scrollView.addSubview(contentView)

    self.view.addVisualConstraint("H:|-0-[scrollView]-0-|", viewsDict: ["scrollView" : scrollView])
    self.view.addVisualConstraint("V:|-0-[scrollView]-0-|", viewsDict: ["scrollView" : scrollView])

    self.view.addVisualConstraint("H:|[contentView]|", viewsDict: ["contentView" : contentView])
    self.view.addVisualConstraint("V:|[contentView]|", viewsDict: ["contentView" : contentView])

    //make the width of content view to be the same as that of the containing view.
    self.view.addVisualConstraint("H:[contentView(==mainView)]", viewsDict: ["contentView" : contentView, "mainView" : self.view])

    self.view.contentMode = UIViewContentMode.Redraw
}

//load all the subviews after the main view and scrollview loaded.
override func viewDidLoad() {
    var viewsDict = [String: UIView]()
    viewsDict["contentView"] = contentView
    viewsDict["super"] = self.view
    var vertical_constraints = "V:|"

    for i in 1...50 {
        var subview = UIView()
        subview.setTranslatesAutoresizingMaskIntoConstraints(false)
        subview.backgroundColor = (i%2 == 0 ? UIColor.brownColor() : UIColor.greenColor())
        viewsDict["subview_\(i)"] = subview
        contentView.addSubview(subview)

        vertical_constraints += "[subview_\(i)(==50)]"
        self.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[subview_\(i)]|", options: NSLayoutFormatOptions(0), metrics: nil, views: viewsDict))
    }

    vertical_constraints += "|"
    self.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(vertical_constraints, options: NSLayoutFormatOptions.AlignAllLeft, metrics: nil, views: viewsDict))
}

}

下面是我期待它是输出的：

Here is the output as I was expecting it to be:

这篇关于编程创建具有的UIScrollView和自动版式控制器无法正常大小的意见的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！