Swift 5 UIScrollView 添加背景图片答案

【问题标题】：Swift 5 UIScrollView adding background imageSwift 5 UIScrollView 添加背景图片
【发布时间】：2020-08-05 09:03:52
【问题描述】：

我正在尝试添加一个背景图像，该图像将与我的垂直滚动视图一起滚动。在添加背景图片之前，我的scrollView只能垂直滚动，但是设置背景图片后，scrollView现在可以水平和垂直滚动，好像背景图片的宽度大于滚动视图的宽度

let scrollView: UIScrollView = {
    let view = UIScrollView()
    view.translatesAutoresizingMaskIntoConstraints = false
    view.isDirectionalLockEnabled = true
    view.isScrollEnabled = true
    return view
}()

let backgroundIV: UIImageView = {
    let imageView = UIImageView(image: UIImage(named: "background"))
    imageView.contentMode = UIView.ContentMode.scaleToFill
    return imageView
}()

我用来设置视图的函数

private func setupContent() {

    scrollViewHeight = viewHeight * 2

    [scrollView].forEach { view.addSubview($0) }
    scrollView.anchor(top: view.topAnchor, leading: view.leadingAnchor, bottom: view.bottomAnchor, trailing: view.trailingAnchor)
    scrollView.contentSize = CGSize(width: 0, height: scrollViewHeight)

    [backgroundIV].forEach { scrollView.addSubview($0) }
    backgroundIV.anchor(top: scrollView.topAnchor, leading: scrollView.leadingAnchor, bottom: scrollView.bottomAnchor, trailing: scrollView.trailingAnchor, size: .init(width: 0, height: scrollViewHeight))

}

那么我应该如何设置我的背景图片以使我的滚动视图不会水平滚动？？

【问题讨论】：

标签： swift uiscrollview swift5

【解决方案1】：

您必须为您的滚动视图设置正确的内容大小或调整内容。

将您的 imageView 宽度设置为等于您的滚动视图的宽度。它将避免 scrollView 水平滚动。请在下面找到设置 widthAchor 的代码。

imageView.widthAnchor.constraintEqualToAnchor(scrollView.widthAnchor).active = true

【讨论】：

像魅力一样工作

【解决方案2】：

在应用 Vikram Parimi 的答案并进一步挖掘之后，有两个因素会影响我的滚动视图变为水平

Scroll View 和 view 之间的约束特性告诉我们：对齐和大小不再矛盾，必须定义两者以消除歧义。我从https://medium.com/@tingyishih/ios-scrollview-constraints-8d8140d329a0
另外一个因素是这个bug只存在于iphone 11 pro max模拟器，不存在iphone 8模拟器，可以使用safeAreaLayoutGuide解决

 if #available(iOS 11.0, *) {
      imageView.widthAnchor.constraintEqualToAnchor(scrollView.safeAreaLayoutGuide.widthAnchor).active = true
 } else {
      imageView.widthAnchor.constraintEqualToAnchor(scrollView.widthAnchor).active = true
 }

【讨论】：