新的iOS 11滚动视图contentLayoutGuide无法正常工作

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了新的iOS 11滚动视图contentLayoutGuide无法正常工作相关的知识,希望对你有一定的参考价值。

我正在尝试制作类似于照片应用的照片查看器,用户可以放大和缩小特定图像。

图像最初的大小非常适合屏幕,但是当缩放时可以扩展以覆盖整个屏幕。

我在一个collectionView单元格中发生这种情况,该单元格是屏幕大小并启用了分页。在该单元格中是一个scrollView,其故事板约束设置为top / bottom / leading / trailing到它的superview。其余的发生在下面的代码中,这是自定义单元格。

根据ios 11中引入的scrollView的新行为,contentView(在我的情况下为imageView)应该在scrollView中居中使用:

imageView.centerXAnchor.constraint(equalTo: scrollView.contentLayoutGuide.centerXAnchor).isActive = true
imageView.centerYAnchor.constraint(equalTo: scrollView.contentLayoutGuide.centerYAnchor).isActive = true

但是,我没有看到它在任何地方解释,并将这两行添加到我的代码中绝对没有任何作用。

scrollView内的imageView继续位于左上角。

希望有人已经想出如何做到这一点,并可以提供帮助。

import UIKit

class ImageCollectionViewCell: UICollectionViewCell, UIScrollViewDelegate {

    @IBOutlet weak var scrollView: UIScrollView! {
        didSet {
            scrollView.delegate = self
            scrollView.minimumZoomScale = 0.2
            scrollView.maximumZoomScale = 2.0
            scrollView.contentSize = imageView.frame.size
            scrollView.addSubview(imageView)

            imageView.translatesAutoresizingMaskIntoConstraints = false

            imageView.widthAnchor.constraint(equalToConstant: 350).isActive = true
            imageView.heightAnchor.constraint(equalToConstant: 350).isActive = true

            imageView.centerXAnchor.constraint(equalTo: scrollView.contentLayoutGuide.centerXAnchor).isActive = true
            imageView.centerYAnchor.constraint(equalTo: scrollView.contentLayoutGuide.centerYAnchor).isActive = true
        }
    }

    var imageView = UIImageView()

    var image: UIImage? {
        get {
            return imageView.image
        }
        set {
            imageView.image = newValue
            scrollView?.contentSize = imageView.frame.size
        }
    }

    func viewForZooming(in scrollView: UIScrollView) -> UIView? {
        return self.imageView
    }

}
答案

我一直面临同样的问题大约一天,我终于明白了。仅仅为图像添加宽度和高度限制是不够的。为了使用contentLayoutGuide工作,图像视图实际上必须与滚动视图的大小相同。因此,您必须执行以下任一操作:

选项1

将图像视图的宽度和高度约束更改为与滚动视图相同的大小。

imageView.widthAnchor.constraint(equalToConstant: scrollView.bounds.width).isActive = true
imageView.heightAnchor.constraint(equalToConstant: scrollView.bounds.height).isActive = true

选项2 - 首选

删除图像视图的宽度和高度约束。而是添加将图像视图的顶部,底部,前导和尾部锚点固定到滚动视图的约束。我试过了两种,这种方法看起来效果最好。

imageView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor).isActive = true
imageView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor).isActive = true
imageView.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
imageView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true

根据您使用它的方式/位置,您可能需要使用scrollView.layoutMarginGuide作为锚点。

我还建议将此代码从didSet移动到名为setup()的私有方法,或者沿着这些方向移动。然后,从viewWillAppear,拨打setup()。这是一种更加一致的方式。希望这有帮助!

以上是关于新的iOS 11滚动视图contentLayoutGuide无法正常工作的主要内容,如果未能解决你的问题,请参考以下文章

更新到 watchOS 6 后,滚动视图停止工作,有啥变化吗?

UIScrollView在iOS11中不滚动

iOS 集合视图滚动滞后

iOS UIScrollView,我误会了啥?我无法让滚动视图滚动

iOS 11 导航栏滚动

iOS 11:带有不透明导航栏的导航控制器内带有滚动视图的弹出视图控制器在转换期间导致奇怪的内容动画