Question

我删除了我的代码，以便于理解。

假设您有一个控制器，并且您想使用纯自动布局添加一个简单的滚动条。

您可以按如下方式调用我的功能工具（如下所示）：

// Create scroll view
let strip = addStripCategoryTo(view)

// Attach it to the view, vertically and horizontally
strip.topAnchor.constraintEqualToAnchor(view.topAnchor).active = true
strip.leftAnchor.constraintEqualToAnchor(view.leftAnchor).active = true


// The function
func addStripCategoryTo(parent: UIView) -> UIView {

    let h:CGFloat = 128
    let w = 2*h/3
    let n = 5
    let width  = w * CGFloat(n)
    let height = h

    // Scroll view
    let scrollview = UIScrollView()
    parent.addSubview(scrollview)

    scrollview.scrollEnabled = true
    scrollview.translatesAutoresizingMaskIntoConstraints = false
    scrollview.widthAnchor .constraintEqualToAnchor(parent.widthAnchor).active = true
    scrollview.heightAnchor.constraintEqualToConstant(h).active = true

    scrollview.layer.borderWidth = 2
    scrollview.layer.borderColor = UIColor.greenColor().CGColor
    scrollview.backgroundColor = UIColor.brownColor()

    // Scroll view content
    let contentView = UIView() //frame:CGRect(origin: CGPointZero, size:CGSize(width: width, height: height)))
    scrollview.addSubview(contentView)
    contentView.backgroundColor = UIColor.redColor()
    contentView.layer.borderWidth = 10
    contentView.layer.borderColor = UIColor.blueColor().CGColor
    contentView.translatesAutoresizingMaskIntoConstraints = false
    contentView.centerYAnchor.constraintEqualToAnchor(scrollview.centerYAnchor).active = true
    contentView.widthAnchor .constraintEqualToConstant(width).active = true
    contentView.heightAnchor.constraintEqualToConstant(height).active = true

    return scrollview
}

不幸的是，我无法横向滚动它，请看截图如下：

我错过了什么？

Answer 1

你的约束应该是这样的，

Scrollview - 顶部，底部，前导，尾随

ContentView - 顶部，底部，前导，尾随，固定宽度，垂直居中于容器（中心y）

并且您的内容视图的宽度应该大于屏幕宽度，然后您也可以水平滚动希望这会有所帮助：）

Answer 2

试一试并回答这个问题，看看是否有帮助。

修改更好地回答问题，删除旧答案：

添加这两行应该使水平滚动： contentView.leadingAnchor.constraintEqualToAnchor(scrollview.leadingAnchor).active = true contentView.trailingAnchor.constraintEqualToAnchor(scrollview.trailingAnchor).active = true

问题是没有这两个约束，scrollView不知道它的contentSize，因此不滚动，即使你给contentView一个特定的宽度。你需要知道scrollView在哪里开始和结束，这两个约束将帮助scrollView知道contentsView宽度有多大。如果不是，scrollView的contentSize将保持与设备的宽度相同，并且contentView将显示在屏幕外，因为它的宽度大于设备的屏幕

希望这会有所帮助。

功能的完整代码

    func addStripCategoryTo(parent: UIView)-> UIView {

    let h:CGFloat = 128
    let w = 2*h/3
    let n = 5
    let width  = w * CGFloat(n)
    let height = h

    // Scroll view
    let scrollview = UIScrollView()
    parent.addSubview(scrollview)

    scrollview.scrollEnabled = true
    scrollview.translatesAutoresizingMaskIntoConstraints = false
    scrollview.leadingAnchor.constraintEqualToAnchor(parent.leadingAnchor).active = true
    scrollview.trailingAnchor.constraintEqualToAnchor(parent.trailingAnchor).active = true
    scrollview.widthAnchor .constraintEqualToAnchor(parent.widthAnchor).active = true
    scrollview.heightAnchor.constraintEqualToConstant(h).active = true

    scrollview.layer.borderWidth = 2
    scrollview.layer.borderColor = UIColor.greenColor().CGColor
    scrollview.backgroundColor = UIColor.brownColor()

    // Scroll view content
    let contentView = UIView() //frame:CGRect(origin: CGPointZero, size:CGSize(width: width, height: height)))
    scrollview.addSubview(contentView)
    contentView.backgroundColor = UIColor.redColor()
    contentView.layer.borderWidth = 10
    contentView.layer.borderColor = UIColor.blueColor().CGColor
    contentView.translatesAutoresizingMaskIntoConstraints = false
    contentView.centerYAnchor.constraintEqualToAnchor(scrollview.centerYAnchor).active = true
    contentView.leadingAnchor.constraintEqualToAnchor(scrollview.leadingAnchor).active = true
    contentView.trailingAnchor.constraintEqualToAnchor(scrollview.trailingAnchor).active = true
    contentView.widthAnchor.constraintEqualToConstant(width).active = true
    contentView.heightAnchor.constraintEqualToConstant(height).active = true

    return scrollview
}

Answer 3

以下是我的问题的解决方案。我提供了一个解决问题的工具函数，如下所示：

func setScrollViewConstraints(scrollView: UIScrollView, contentView:UIView, multiplier m:(width:CGFloat, height:CGFloat)=(1, 1)) {

    guard let scrollViewParent = scrollView.superview else {
        assert(false, "setScrollViewConstraints() requires the scrollview to have a superview")
        return
    }

    guard let contentViewParent = contentView.superview else {
        assert(false, "setScrollViewConstraints() requires the contentView to have a superview")
        return
    }

    guard contentViewParent == scrollView else {
        assert(false, "setScrollViewConstraints() requires the contentView to have a superview being the scrollView")
        return
    }

    scrollView.translatesAutoresizingMaskIntoConstraints = false
    scrollView.widthAnchor  .constraintEqualToAnchor(scrollViewParent.widthAnchor,  multiplier: m.width ).active = true
    scrollView.heightAnchor .constraintEqualToAnchor(scrollViewParent.heightAnchor, multiplier: m.height).active = true


    contentView.translatesAutoresizingMaskIntoConstraints = false
    contentView.leftAnchor  .constraintEqualToAnchor(contentViewParent.leftAnchor      ).active = true
    contentView.rightAnchor .constraintEqualToAnchor(contentViewParent.rightAnchor     ).active = true
    contentView.topAnchor   .constraintEqualToAnchor(contentViewParent.topAnchor       ).active = true
    contentView.bottomAnchor.constraintEqualToAnchor(contentViewParent.bottomAnchor    ).active = true

   /*

 // Pre-iOS 9 version

 let views = [
 "scrollView":scrollview,
 "contentView":contentView
 ]

 parent.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[scrollView]|", options:[], metrics: [:], views:views))
 parent.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[scrollView]|", options:[], metrics: [:], views:views))

 scrollview.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[contentView]|", options:[], metrics: [:], views:views))
 scrollview.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[contentView]|", options:[], metrics: [:], views:views))
 */

}

像这样使用滚动视图100％宽度的超视图和1/4高度：

func addStripCategoryTo(parent: UIView) -> UIView {

    // Scroll view
    let scrollview = UIScrollView()
    parent.addSubview(scrollview)

    scrollview.backgroundColor    = UIColor.brownColor()
    scrollview.layer.borderWidth  = 2
    scrollview.layer.borderColor  = UIColor.greenColor().CGColor

    // Scroll view content
    let contentView = UIImageView()
    contentView.image = UIImage(named: "cover-0.jpeg")
    scrollview.addSubview(contentView)

    contentView.backgroundColor   = UIColor.redColor()
    contentView.layer.borderWidth = 10
    contentView.layer.borderColor = UIColor.blueColor().CGColor

    // Apply constraints
    setScrollViewConstraints(scrollview, contentView:contentView, multiplier: (1, 0.25))

    return scrollview
}

无法使用纯自动布局约束创建UIScrollerView

3 个答案: