在 UIStackView 中缩放 UIImage 的图像以适应 iOS 应用中的屏幕大小

Question

在我用 Swift 3 编写的 iOS 应用程序上，我有 4 个 UIImages，每个 2 个在一个 UIStackView 中，2 个 UIStackViews 在另一个 UIStackView 中，如下图所示：

在图片中你可以看到我对图片的划分。

您还可以看到问题，当图像退出屏幕时用户无法看到完整图像，因为它被裁剪了。

所有图像在 Assets.xcassets 中的图像集上都是“2x”大小。

在属性检查器的 Main.storyboard 上，我将所有 4 个图像的内容模式更改为 "Scale To Fill"。我也在代码中这样做了：

phoneCallImage.contentMode = UIViewContentMode.scaleAspectFit
sendEmailImage.contentMode = UIViewContentMode.scaleAspectFit
sendSmsImage.contentMode = UIViewContentMode.scaleAspectFit
openFacebookImage.contentMode = UIViewContentMode.scaleAspectFit

我也尝试使用完整的 UIStackView（图片中的图像堆栈视图）来做到这一点：

imagesStackView.contentMode = UIViewContentMode.scaleAspectFit

我该怎么做才能解决这个问题并在不裁剪的情况下显示完整图像？

Answer 1

我设法解决了这个问题。
首先，我选择了完整的 UIStackView（图片中的 Images Stack View）并向其添加约束，以将边距设置为 0:

之后，我选择了 UIStackView 中的所有图像，并从约束菜单中将其宽度和高度更改为 171.5，以使其成为正方形：

在那之后，一切都与屏幕完美对齐。

Answer 2

您需要为单个图像和包含的堆栈视图设置约束。

~~对于每个图像，您需要指定一个等于最顶部堆栈视图的宽度约束，乘数为 0.5（父宽度的 50%），以便它随屏幕尺寸缩放。~~

然后，对于每张图片，您可能希望对宽高比使用约束以保持宽高比 1:1，以便高度也同样缩放。

然后对于顶部堆栈视图，您需要将其宽度也限制为父视图，然后为左边距和 y 位置添加约束。

查看图片了解约束条件和最终结果。

在 UIStackView 中缩放 UIImage 的图像以适应 iOS 应用中的屏幕大小

Scale images of UIImage in UIStackView to fit screen size in iOS app

crop

uiimage

ios

swift

uistackview