弹性布局不适用于子视图控制器

Question

我正在尝试按照此处描述的示例制作包含 UIImageView 和 UIScrollView 的弹性布局。 https://github.com/TwoLivesLeft/StretchyLayout/tree/Step-6

唯一的区别是我将示例中使用的 UILabel 替换为子 UIViewController 的视图，它本身包含 UICollectionView。这是我的布局的样子 - 蓝色项目是 UICollectionViewCell.

这是我的代码：

import UIKit
import SnapKit

class HomeController: UIViewController, UIScrollViewDelegate {

private let scrollView = UIScrollView()
private let imageView = UIImageView()
private let contentContainer = UIView()
private let collectionViewController = CollectionViewController()

override var preferredStatusBarStyle: UIStatusBarStyle {
    return .lightContent
}

override func viewDidLoad() {
    super.viewDidLoad()


    scrollView.contentInsetAdjustmentBehavior = .never
    scrollView.delegate = self

    imageView.image = UIImage(named: "burger")
    imageView.contentMode = .scaleAspectFill
    imageView.clipsToBounds = true

    let imageContainer = UIView()
    imageContainer.backgroundColor = .darkGray

    contentContainer.backgroundColor = .clear

    let textBacking = UIView()
    textBacking.backgroundColor = #colorLiteral(red: 0.7450980544, green: 0.1235740449, blue: 0.2699040081, alpha: 1)

    view.addSubview(scrollView)

    scrollView.addSubview(imageContainer)
    scrollView.addSubview(textBacking)
    scrollView.addSubview(contentContainer)
    scrollView.addSubview(imageView)

    self.addChild(collectionViewController)
    contentContainer.addSubview(collectionViewController.view)
    collectionViewController.didMove(toParent: self)


    scrollView.snp.makeConstraints {
        make in

        make.edges.equalTo(view)
    }

    imageContainer.snp.makeConstraints {
        make in

        make.top.equalTo(scrollView)
        make.left.right.equalTo(view)
        make.height.equalTo(imageContainer.snp.width).multipliedBy(0.7)
    }

    imageView.snp.makeConstraints {
        make in

        make.left.right.equalTo(imageContainer)

        //** Note the priorities
        make.top.equalTo(view).priority(.high)

        //** We add a height constraint too
        make.height.greaterThanOrEqualTo(imageContainer.snp.height).priority(.required)

        //** And keep the bottom constraint
        make.bottom.equalTo(imageContainer.snp.bottom)
    }

    contentContainer.snp.makeConstraints {
        make in

        make.top.equalTo(imageContainer.snp.bottom)
        make.left.right.equalTo(view)
        make.bottom.equalTo(scrollView)
    }

    textBacking.snp.makeConstraints {
        make in

        make.left.right.equalTo(view)
        make.top.equalTo(contentContainer)
        make.bottom.equalTo(view)
    }

    collectionViewController.view.snp.makeConstraints {
        make in

        make.left.right.equalTo(view)
        make.top.equalTo(contentContainer)
        make.bottom.equalTo(view)
    }

}

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()

    scrollView.scrollIndicatorInsets = view.safeAreaInsets
    scrollView.contentInset = UIEdgeInsets(top: 0, left: 0, bottom: view.safeAreaInsets.bottom, right: 0)
}

//MARK: - Scroll View Delegate

private var previousStatusBarHidden = false

func scrollViewDidScroll(_ scrollView: UIScrollView) {
    if previousStatusBarHidden != shouldHideStatusBar {

        UIView.animate(withDuration: 0.2, animations: {
            self.setNeedsStatusBarAppearanceUpdate()
        })

        previousStatusBarHidden = shouldHideStatusBar
    }
}

//MARK: - Status Bar Appearance

override var preferredStatusBarUpdateAnimation: UIStatusBarAnimation {
    return .slide
}

override var prefersStatusBarHidden: Bool {
    return shouldHideStatusBar
}

private var shouldHideStatusBar: Bool {
    let frame = contentContainer.convert(contentContainer.bounds, to: nil)
    return frame.minY < view.safeAreaInsets.top
}

}

除了 innerText 被我的 CollectionViewController 替换之外，其他都与此文件中的相同：https://github.com/TwoLivesLeft/StretchyLayout/blob/Step-6/StretchyLayouts/StretchyViewController.swift。

如您所见，UICollectionView 显示正确 - 但是我无法再向上或向下滚动。我不确定我的错误在哪里。

Answer 1

您似乎在限制集合视图的大小以适应包含集合视图的容器视图和图像视图的 parent 视图的边界。结果，容器 scrollView 没有 contentSize 可以滚动，这就是你无法滚动的原因。您需要确保集合视图的内容大小反映在 parent 滚动视图的内容大小中。

在您给出的示例中，此行为是通过标签的长度要求高度大于图像视图与视图其余部分之间的高度来实现的。在您的情况下，集合视图容器需要表现得好像它大于该区域。

编辑： 更准确地说，您需要将 collectionView.contentSize 传递给您的 scrollView.contentSize。滚动视图的 contentSize 是可设置的，因此您只需将 scrollView.contentSize 增加 collectionView.contentSize - collectionView.height （因为您的滚动视图当前的 contentSize 当前包括 collectionView 的高度).我不确定你是如何添加你的 child 视图控制器的，但在你这样做的时候，我会相应地增加你的 scrollView 的 contentSize。但是，如果在那之后您的 collectionView 的大小发生变化，您还需要确保将更改委托给您的 scrollView。这可以通过以下协议来实现：

protocol InnerCollectionViewHeightUpdated {
  func collectionViewContentHeightChanged(newSize: CGSize)
}

然后让包含 scrollView 的控制器执行此协议并相应地更新 scrollView contentSize。从你的 collectionView child 控制器，你会有一个 delegate 属性这个协议（在创建 child 视图控制器时设置这个，将委托设置为 self，控制器包含 child VC 和 scrollView)。然后，每当 collectionView 高度发生变化时（例如，如果您添加单元格），您可以执行 delegate.collectionViewContentHeightChanged(... 以确保您的滚动行为将继续起作用。

弹性布局不适用于子视图控制器

Stretchy Layout not working with child view controller

uiscrollview

ios

uicollectionview

swift

snapkit