UIScrollView contentLayoutGuide 和缩放居中

Question

这里要解决的问题是如何在保持居中的同时放大 UIScrollView。如果你不采取某种预防措施，默认是当我们缩小时，缩放后的视图会向上滑动到滚动视图的左上角，如下所示：

那么如何防止这种情况，并在我们缩放时将缩放视图保持在中心？正如您可能知道的那样，有一些传统的方法可以通过弄乱滚动视图的布局来处理这个问题，正如 Josh 和 Eliza 在出色的经典 WWDC video 104 from 2010 中所描述的那样。这可以通过使用委托或通过子类化 UIScrollView 来完成，并提供所需的结果：

现在是 WWDC 2017 视频 201 (https://developer.apple.com/videos/play/wwdc2017/201/?time=1496)，Eliza 声称新的 (iOS 11) contentLayoutGuide 解决了缩放问题，同时以一种新的方式保持居中：她说让内容居中在内容布局指南的中心查看。

但她没有展示。当我自己尝试时，我发现它并没有解决问题。我放大 in 很好，但是当缩小 out 时，缩放比例小于 1，内容视图向上移动到左上角，就像它一样一直都有。

有没有人弄清楚视频中的这个声明的真正含义？ iOS 11 如何让居中缩放比过去更容易？

编辑我实际上收到了 Apple 的一个示例项目，以回应我的错误报告，他们声称说明了如何解决这个问题，但事实并非如此！所以我得出的结论是，即使是苹果也不知道他们在说什么。

Answer 1

这是您/每个人都在寻找的解决方案。在我的情况下，我想在表格视图滚动视图中居中视图。因此，如果表格视图滚动，自定义视图将始终位于滚动视图内容的中心。

// create a view
let v:UIView = UIView(frame:CGRect.zero)    // use zero if using constraints
    ibTableView.addSubview(v)
    ibTableView.bringSubview(toFront:v)
v.translatesAutoresizingMaskIntoConstraints = no
v.backgroundColor = .yellow
v.widthAnchor.constraint(equalToConstant:100).isActive = yes
v.heightAnchor.constraint(equalToConstant:100).isActive = yes

// set scrollview guides
ibTableView.contentLayoutGuide.widthAnchor.constraint(equalTo:ibTableView.frameLayoutGuide.widthAnchor).isActive = yes
ibTableView.contentLayoutGuide.heightAnchor.constraint(equalTo:ibTableView.frameLayoutGuide.heightAnchor).isActive = yes

// anchor view
v.centerXAnchor.constraint(equalTo:ibTableView.contentLayoutGuide.centerXAnchor).isActive = yes
v.centerYAnchor.constraint(equalTo:ibTableView.contentLayoutGuide.centerYAnchor).isActive = yes

Answer 2

由于未定义滚动视图的 contentSize，因此视图转到左上角。在 iOS 11 中使用新的 Auto Layout guides 时，仍然需要定义 contentSize。

添加以下约束：

scrollView.contentLayoutGuide.widthAnchor.constraint(equalTo: scrollView.frameLayoutGuide.widthAnchor),
scrollView.contentLayoutGuide.heightAnchor.constraint(equalTo: scrollView.frameLayoutGuide.heightAnchor)

---

当我有一个具有固定宽度/高度和以下附加约束的 contentView 时，这对我有用：

//  give the centerView explicit height and width constraints
centerView.widthAnchor.constraint(equalToConstant: 500),
centerView.heightAnchor.constraint(equalToConstant: 500),

//  pin the center of the centerView to the center of the scrollView's contentLayoutGuide
centerView.centerXAnchor.constraint(equalTo: scrollView.contentLayoutGuide.centerXAnchor),
centerView.centerYAnchor.constraint(equalTo: scrollView.contentLayoutGuide.centerYAnchor)