如何在 Swift 中使用带有滚动视图的自动布局？

Posted 2023-03-10

【中文标题】如何在 Swift 中使用带有滚动视图的自动布局？

【英文标题】：How to use auto layout with scrollView in iOS with Swift?

【发布时间】：2016-12-24 01:51:09

【问题描述】：

我尝试向我的 scrollView 添加一个视图，当我手动将宽度设置为 greenView 时它工作正常，但如果我尝试使用 constrants，似乎约束不起作用。我有什么问题吗？有人可以帮忙吗？

这是我的控制器和查看代码：

import UIKit
import Material

class UserProfileViewController: UIViewController 

    override func loadView()
        self.view = UserProfileView()
    

    override func viewDidLoad() 
        super.viewDidLoad()
    




import UIKit
import Material

class UserProfileView: UIView 

    fileprivate var scrollView: UIScrollView!

    convenience init()
        self.init(frame: CGRect.zero)
        self.backgroundColor = UIColor(red:0.15, green:0.24, blue:0.37, alpha:1.0)
        prepareScrollView()
        prepareMainView()
    

    fileprivate func prepareScrollView() 
        self.scrollView = UIScrollView(frame: UIScreen.main.bounds)
        self.scrollView.contentSize = CGSize(width:self.scrollView.width, height: 1678)
        self.addSubview(scrollView)
    

    fileprivate func prepareMainView() 
        let greenView = UIView()
        greenView.backgroundColor = UIColor.green
        greenView.height = 100


        self.scrollView.addSubview(greenView)

        self.scrollView.translatesAutoresizingMaskIntoConstraints = false
        self.scrollView.isScrollEnabled = true
        self.scrollView.isPagingEnabled = true
        greenView.translatesAutoresizingMaskIntoConstraints = false

        let views = [
            "scrollView": self.scrollView!,
            "greenView": greenView,
        ] as [String : Any]



        let scrollViewHeight = NSLayoutConstraint.constraints(withVisualFormat: "V:|[scrollView]|", metrics: nil, views: views)
        let scrollViewWidth = NSLayoutConstraint.constraints(withVisualFormat: "H:|[scrollView]|", metrics: nil, views: views)
        let greenViewHorizontalConstraint = NSLayoutConstraint.constraints(withVisualFormat: "H:|[scrollView][greenView][scrollView]|", metrics: nil, views: views)
        let greenViewVerticalConstraint = NSLayoutConstraint.constraints(withVisualFormat: "V:|[scrollView][greenView]|", metrics: nil, views: views)

        self.addConstraints(scrollViewHeight)
        self.addConstraints(scrollViewWidth)
        self.addConstraints(greenViewHorizontalConstraint)
        self.addConstraints(greenViewVerticalConstraint)

    

【问题讨论】：

这是约束的“旧式”编码，所以我在这里可能错了。您是否收到冲突的约束警告？我正在阅读两套 V/H，一套有两个视图，一套只有滚动视图。

不，我没有遇到任何冲突。您还有其他方法吗？

布局锚。它基本上是不同的语法。解释对于评论来说太长了（这不是答案），所以这里有一个博客文章的链接：useyourloaf.com/blog/pain-free-constraints-with-layout-anchors。它采用 Swift 2 语法，但 Swift 3 没有任何改变。您可以决定它是否比使用 Visual Forma Language 更容易。

我知道这种方式，但它是一样的只是更冗长。

我创建了 LayoutAnchors 但还是同样的问题。

【参考方案1】：

我在你的代码中看不到你激活约束的地方。

请注意下面我们如何激活约束。

//create
let childredView = UIView()
childredView.translatesAutoresizingMaskIntoConstraints = false
childredView.backgroundColor = UIColor.purple

//add it
self.view.addSubview(childredView)
self.view.bringSubview(toFront: childredView)

//set constraints
let views = ["childrenView": childredView]
let vertical = NSLayoutConstraint.constraints(withVisualFormat: "V:|[childrenView]|", options: [], metrics: nil, views: views)
let horizontal = NSLayoutConstraint.constraints(withVisualFormat: "H:|[childrenView]|", options: [], metrics: nil, views: views)
let all = vertical + horizontal

//activate them
NSLayoutConstraint.activate(all)

如果您使用布局锚，请确保在您创建的每个 YAnchor 的末尾添加 isActive = true。例如：

item.centerYAnchor.constraint(equalTo:self.view.centerYAnchor).isActive = true

【讨论】：

我将约束添加到视图中，因此它们处于活动状态。它适用于 UIView 但不适用于 UIScrollView。

我也尝试了激活的方式，但还是同样的问题。