ScrollView内的iOS动态内容视图无法正确滚动

Question

我创建了一个ViewController ScrollView View的直接孩子，现在我在View内添加了ScrollView约束：

我添加了一个VerticalLayout类，其代码如下：

class VerticalLayout: UIView {

    var yOffsets: [CGFloat] = []
    var heightValue : CGFloat = 0.0

    init(width: CGFloat) {
        super.init(frame: CGRect(x:0, y:0, width:width, height:0))
    }

    required init(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func layoutSubviews() {

        var height: CGFloat = 0

        for i in 0..<subviews.count {
            let view = subviews[i] as UIView
            view.layoutSubviews()
            height += yOffsets[i]
            view.frame.origin.y = height
            height += view.frame.height
        }

        self.frame.size.height = height
        self.heightValue = height

    }

    override func addSubview(_ view: UIView) {
        yOffsets.append(view.frame.origin.y)
        super.addSubview(view)
    }

    func removeAll() {
        for view in subviews {
            view.removeFromSuperview()
        }
        yOffsets.removeAll(keepingCapacity: false)

    }

}

ViewController代码为：

class ViewController: UIViewController {

    @IBOutlet var contentview: UIView!


    @IBOutlet var scrollview: UIScrollView!

    override func viewDidLoad() {
        super.viewDidLoad()
        contentview.backgroundColor = UIColor.lightGray
        let vLayout = VerticalLayout(width: view.frame.width)
        vLayout.backgroundColor = UIColor.cyan
        contentview.addSubview(vLayout)

        vLayout.addSubview(getView(color: UIColor.red))
        vLayout.addSubview(getView(color: UIColor.magenta))
        vLayout.addSubview(getView(color: UIColor.green))
        vLayout.addSubview(getView(color: UIColor.blue))
        vLayout.addSubview(getView(color: UIColor.yellow))
        contentview.frame.size.height = vLayout.heightValue
        contentview.layoutIfNeeded()
    }

    func getView(color:UIColor) -> UIView
    {
        let view = UIView(frame: CGRect(x:100, y:50, width:100, height:100))
        view.backgroundColor = color
        return view
    }
}

但是当我运行此代码时，我会看到这个屏幕：

此屏幕的内容不可滚动。我错过了什么？

Answer 1

此处您缺少滚动视图内容大小。添加视图后请设置scrollview内容大小。

scrollView.contentSize = CGSize(width: height of total no of views, height: width of the screen)

Answer 2

这对我很有用，我认为纵向UIStackView非常适合这样的问题，而不是手动处理视图

class ViewController: UIViewController{

    @IBOutlet var contentview: UIView!

    @IBOutlet var scrollView: UIScrollView!

    override func viewDidLoad() {
        super.viewDidLoad()


        contentview.backgroundColor = UIColor.lightGray

        let vLayout = VerticalLayout(width: view.frame.width)

        vLayout.backgroundColor = UIColor.cyan

        contentview.addSubview(vLayout)

        vLayout.addSubview(getView(color: UIColor.red))
        vLayout.addSubview(getView(color: UIColor.magenta))
        vLayout.addSubview(getView(color: UIColor.green))
        vLayout.addSubview(getView(color: UIColor.blue))
        vLayout.addSubview(getView(color: UIColor.yellow))
        vLayout.addSubview(getView(color: UIColor.red))
        vLayout.addSubview(getView(color: UIColor.magenta))
        vLayout.addSubview(getView(color: UIColor.green))
        vLayout.addSubview(getView(color: UIColor.blue))
        vLayout.addSubview(getView(color: UIColor.yellow))
        vLayout.addSubview(getView(color: UIColor.red))
        vLayout.addSubview(getView(color: UIColor.magenta))
        vLayout.addSubview(getView(color: UIColor.green))
        vLayout.addSubview(getView(color: UIColor.blue))
        vLayout.addSubview(getView(color: UIColor.yellow))

    }

    func getView(color:UIColor) -> UIView
    {
        let view = UIView(frame: CGRect(x:100, y:50, width:100, height:100))
        view.backgroundColor = color
        return view
    }


}

class VerticalLayout: UIView {

    var yOffsets: [CGFloat] = []
    var heightValue : CGFloat = 0.0

    init(width: CGFloat) {
        super.init(frame: CGRect(x:0, y:0, width:width, height:0))
    }

    required init(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func layoutSubviews() {

        var height: CGFloat = 0

        for i in 0..<subviews.count {
            let view = subviews[i] as UIView
            view.layoutSubviews()
            height += yOffsets[i]
            view.frame.origin.y = height
            height += view.frame.height
        }

        // main edit is here

        self.frame.size.height = height

        self.heightValue = height

        let ff = self.superview

        let dd = ff?.superview as! UIScrollView

        dd.contentSize = CGSize.init(width: self.frame.size.width, height: height)

    }

    override func addSubview(_ view: UIView) {
        yOffsets.append(view.frame.origin.y)
        super.addSubview(view)
    }

    func removeAll() {
        for view in subviews {
            view.removeFromSuperview()
        }
        yOffsets.removeAll(keepingCapacity: false)

    }

}

Answer 3

您只需将内容视图的约束设置为

1. 超级视图
2. 导致超级视图
3. 追踪到超级视图
4. 从底部到超级视图
5. 与超级视图相等的宽度
6. 等于高视图的高度

最后一次点击相等的高度约束并设置低优先级（250）。

您的卷轴将完美运作。