在 UIScrollView 中滚动 UIView

Question

对此有很多问题，但我对约束很不满意。所以我添加了一个UIScrollView，我想显示的UIView 的高度为700，这是固定的700 没有动态高度。我对UIScrollView 的限制是：

对于UIView，约束是：

但它没有滚动。

Answer 1

当您将 AutoLayout 赋予 scrollView 时，请遵循以下方法。

像对待任何其他视图对象一样对待 ScrollView 并像往常一样应用约束：

在 scrollView 中获取一个视图，该视图稍后将包含您在 ScrollView 中想要的所有视图。像应用到子视图一样应用约束，如下所示：

除了前导、尾随、顶部和底部约束外，还额外指定了宽度和高度。 宽度和高度将定义 ScrollView 可以在水平或垂直方向滚动多少。

您可能希望指定与您可能在此子视图中添加的其他内容相关的高度和宽度，而不是直接指定宽度和高度。

提示：如果可以从上到下画一条直线，连接子视图的Y轴约束，就不会出现歧义内容错误。宽度也是如此。

以编程方式，您可以采用相同的方法：

    let scrollView = UIScrollView()
    self.view.addSubview(scrollView)
    scrollView.translatesAutoresizingMaskIntoConstraints = false
    let safeArea = view.safeAreaLayoutGuide
    scrollView.topAnchor.constraint(equalTo: safeArea.topAnchor, constant: 0).isActive = true
    scrollView.leftAnchor.constraint(equalTo: self.view.leftAnchor).isActive = true
    scrollView.rightAnchor.constraint(equalTo: self.view.rightAnchor).isActive = true
    scrollView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true
    scrollView.backgroundColor = .gray

    let scrollContentView = UIView()
    scrollView.addSubview(scrollContentView)
    scrollContentView.translatesAutoresizingMaskIntoConstraints = false
    scrollContentView.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
    scrollContentView.rightAnchor.constraint(equalTo: scrollView.rightAnchor).isActive = true
    scrollContentView.leftAnchor.constraint(equalTo: scrollView.leftAnchor).isActive = true
    scrollContentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true
    scrollContentView.widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true
    scrollContentView.heightAnchor.constraint(equalTo: scrollView.heightAnchor).isActive = true
    scrollContentView.backgroundColor = .green

你可以根据自己的需求增加scrollContentView的heightAnchor或者widthAnchor。

Answer 2

将高度赋予滚动视图内的内容视图，而不仅仅是滚动视图本身

Answer 3

当我需要可滚动视图时，我会做以下事情 - 只需在情节提要中检查您的约束并在那里做同样的事情（特别注意第二步）：

1. 我将scrollView 添加到层次结构并使用自动布局来正确布局它，例如，如果它应该覆盖viewController 的整个view：

   scrollView.translatesAutoresizingMaskIntoConstraints = false
   
   NSLayoutConstraint.activate([
       scrollView.leftAnchor.constraint(equalTo: self.view.leftAnchor),
       scrollView.rightAnchor.constraint(equalTo: self.view.rightAnchor),
       scrollView.topAnchor.constraint(equalTo: self.view.topAnchor),
       scrollView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor),
   ])
   

2. 然后您需要在scrollView 中添加一个contentView 并为其提供适当的布局约束，因此如果您想要在我上面开始的示例中垂直滚动scrollView，您需要以下自动布局约束：

   contentView.translatesAutoresizingMaskIntoConstraints = false
   
   NSLayoutConstraint.activate([
       // horizontal anchors of contentView are constrained to scrollView superview
       // to prevent it from scrolling horizontally
       contentView.leftAnchor.constraint(equalTo: self.view.leftAnchor),
       contentView.rightAnchor.constraint(equalTo: self.view.rightAnchor),
       // but vertical anchors of contentView are constrained to
       // scrollView to allow scrolling
       contentView.topAnchor.constraint(equalTo: scrollView.topAnchor),
       contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
   ])
   

   请注意，我将contentView 的leftAnchor 和rightAnchor 限制为self.view 而不是scrollView，以使其具有固定宽度。但是，顶部和底部锚点被限制在滚动视图中，因此当contentView 需要更多空间时，它们会被展开和滚动。

3. 现在您将所需的所有内容添加到contentView，并使用自动布局对其进行布局，就好像contentView 是一个无限高的视图。或者您可以根据需要将其高度显式设置为 700。