以编程方式出现错误的UIView对于UIScrollView,可滚动内容的大小不明确。只有第一次

时间:2019-12-07 11:07:56

标签: swift uiscrollview uikit uistackview snapkit

我的UIViewController包含一个UIScrollView,正在遇到奇怪的行为。 ViewController是从另一个ViewController推送的。该视图的布局如下

  • UIView
    • UIScrollView
      • UIView
        • UIImageVIew
          • UILabel
        • UIStackView

设置约束和更新stackView内容的方法如下。

private extension PresentationViewController {

    func setupView() {
        isScrolling = true

        view.addSubview(scrollView)
        scrollView.snp.makeConstraints { (builder) in
            builder.top.left.bottom.right.equalToSuperview()
        }

        scrollView.addSubview(contenView)
        contenView.snp.makeConstraints { (builder) in
            builder.top.left.bottom.right.equalToSuperview()
            builder.width.equalToSuperview()
        }

        contenView.addSubview(headerImageView)
        headerImageView.snp.makeConstraints { (builder) in
            builder.top.left.right.equalToSuperview()
            builder.height.equalTo(view.frame.height / 2)
        }

        headerImageView.addSubview(headerTitleLabel)
        headerTitleLabel.snp.makeConstraints { (builder) in
            builder.left.right.equalToSuperview()
            builder.centerX.equalToSuperview()
            builder.centerY.equalToSuperview()
        }

        contenView.addSubview(presentationStackView)
        presentationStackView.snp.makeConstraints { (builder) in
            builder.top.equalTo(headerImageView.snp.bottom).inset(-Margins.xxLarge)
            builder.left.right.equalToSuperview()
            builder.bottom.equalTo(scrollView.snp.bottom)
        }

    }

    func updateView(presentationResponse: PresentationResponse?) {
        guard let presentationResponse = presentationResponse else { return }

        let firstPresentation = presentationResponse.presentationItems[0]
        titleView.title = presentationResponse.galleryName

        headerImageView.sd_setImage(with: URL(string: firstPresentation.imageSet.fullSize ?? ""), placeholderImage: nil)
        headerTitleLabel.text = presentationResponse.galleryName

        for item in presentationResponse.presentationItems.dropFirst() {

            let sectionImageView = UIImageView()
            sectionImageView.contentMode = .scaleAspectFit
            sectionImageView.clipsToBounds = true

            let sectionCaptionLabel = BaseLabel(withConfiguration: .headline)
            sectionCaptionLabel.text = item.rowCaption

            let sectionView = UIView()
            sectionView.addSubview(sectionImageView)
            sectionView.addSubview(sectionCaptionLabel)

            sectionImageView.sd_setImage(with: URL(string: item.imageSet.defaultImage ?? "")) { [weak self, weak sectionView] (image, error, _, _) in

                guard let strongSelf = self,
                    let sectionView = sectionView,
                    let image = image else { return }

                strongSelf.presentationStackView.addArrangedSubview(sectionView)

                sectionImageView.snp.makeConstraints { (builder) in
                    builder.top.left.bottom.equalToSuperview().inset(Margins.medium)
                    let width:CGFloat = strongSelf.view.frame.size.width / 3
                    builder.width.equalTo(width)
                    builder.height.equalTo(width * (1 / image.aspectRatioValue))

                }

                sectionCaptionLabel.snp.makeConstraints { (builder) in
                    builder.left.equalTo(sectionImageView.snp.right).inset(-Margins.medium)
                    builder.top.right.equalToSuperview().inset(Margins.medium)
                }

            }

        }

    }

}

完成对后端的异步操作后,会在ViewDidLoad和updateView(:)中触发setupView()。

您可能已经看到,我使用Snapkit来约束我。 使用调试器工具检查UI时,出现以下消息:

Scrollable content size is ambiguous for UIScrollView

该问题似乎与UIStackView有关,因为未显示。 但是,如果我回头再按一次,则不会出现错误,并且一切都可以正确显示。

2 个答案:

答案 0 :(得分:1)

如果布局显示正确,则您真的不必担心

Scrollable content size is ambiguous for UIScrollView

在调试视图层次结构中发出警告。但是,如果要摆脱它,请在堆栈视图设置中添加一行:

    presentationStackView.snp.makeConstraints { (builder) in
        builder.top.equalTo(headerImageView.snp.bottom).inset(-Margins.xxLarge)
        builder.left.right.equalToSuperview()
        builder.bottom.equalTo(scrollView.snp.bottom)

        // add this line
        builder.height.equalTo(0).priority(250)

    }

这将为堆栈视图提供有效的高度(为零),以便自动布局可以在其为空时进行考虑...但是250的低优先级将使其在您添加排列的子视图时垂直扩展

答案 1 :(得分:0)

只需向与主视图(而不是UIScrollView)相关的StackView视图添加约束Equal Height和Equal Width。换句话说,容器视图的约束与UIScrollView的超级视图相关。

此后,情节提要中将没有警告,您可以继续为子视图添加约束。