如何在 UIScrollView 内使用 Autolayout 将 UIImage 视图缩放为正方形

Posted 2023-03-14

【中文标题】如何在 UIScrollView 内使用 Autolayout 将 UIImage 视图缩放为正方形

【英文标题】：How to scale a UIImage view to a square with Autolayout inside a UIScrollView

【发布时间】：2014-09-10 19:27:50

【问题描述】：

我一直在努力学习自动布局（终于）。我想要一个垂直滚动的 UIScrollView 来保存视图的所有内容。我想将 UIImage 视图固定到滚动视图的顶部，并将图像保持为正方形（scaleToFill）。基本上我想这样做（只是我想用自动布局来做）：

我无法让图像在保持在屏幕范围内的同时保持其纵横比。每当我添加纵横比约束时，imageView 都会增长到 600 点（我认为是 png 的宽度），但我希望它与屏幕一样宽。

我认为我正在为 UIImageView 正确设置约束，因为如果我摆脱了 scrollView 而只是将 imageViw 直接放在视图上，那么它似乎会做我想做的事。诀窍是把它放在滚动视图中。

这是我目前的设置方式：

滚动视图上的4个垂直/水平空间约束都设置为常量0。

【问题讨论】：

你想保持图像的原始纵横比，所以如果尺寸大于屏幕边界，它会在滚动视图中滚动？或者只是适合框架？如果是后者，那你为什么还需要滚动视图？

我不想保持图像的纵横比。我希望它始终是正方形。我将在图片下方放置一堆内容，用户可以向下滚动阅读。

那你为什么不把滚动视图放在图片下面呢？

我希望图像在用户向下滚动时滚开。

【参考方案1】：

由于UIScrollView 的大小取决于其内容，因此您的UIImageView 子视图的大小不能依赖于它。

您必须删除UIImageView 的纵横比约束并使用固定宽度。您还可以让您的UIImageView 宽度依赖于UIScrollView 中的另一个视图，该视图具有固定宽度或其他明确宽度。

不要忘记在 Interface Builder 中使用占位符作为固有大小值。

希望这会有所帮助。

【讨论】：

那么你不能在 IB 中手动设置滚动视图的 contentSize 吗？通常我只是设置一个框架和一个内容大小。有没有办法根据我创建该实例的框架来告诉整个事情进行调整？占位符作为内在大小值的业务是什么？我在 SO 上看到过其他关于此的帖子，但我还不明白它的作用/原因是什么。

抱歉所有后续问题。

与 AutoLayout 一起使用时，scrollView 的行为有点不同。你可以在这里阅读：developer.apple.com/library/ios/technotes/tn2154/_index.html。使用占位符作为内在大小值的原因是您可以在 IB 中查看您设置的大小的视图，如果选择默认值，IB 会抱怨。来自 IB：“设置设计时固有内容大小仅影响在 Interface Builder 中编辑时的视图。视图在运行时不会具有此固有内容大小。”

如果你有一个固定的宽度和高度，没有必要这样做。我也在尝试学习自动布局，它有点棘手，但我认为它非常强大。