Ios 如何使用“自动布局”使用superview调整方形视图的大小

在我的特殊情况下，视图控制器中有视图，为此我添加了以下约束：

• 将前缘、后缘、顶边和底边设置为0
• 将“底部边缘倍增”设置为2:1

现在视图位于视图控制器的上半部分

在该视图中，我添加了一个方形图像视图，并为其添加了以下约束：

• 按住Ctrl键从图像视图拖动到superview，并添加相等的高度和宽度
• 更改宽度和高度的乘数，直到我有一个完美的正方形
• 添加了垂直和水平居中的约束

我的约束看起来很完美，但是当在模拟器中运行时，我没有得到一个完美的正方形。此外，在不同的模拟器屏幕上运行时，图像视图不会调整大小

这是我的设置：

• 已启用自动布局和大小类
• 我为情节提要使用推断的大小
• 宽度和高度的“自适应布局”设置为“任意”
• 我试着在4s、5、6和6+模拟器上运行这个

我查看了其他stackoverflow帖子，但似乎没有任何效果

有一些基本的步骤可以做到这一点吗

编辑：

设置>=10个约束后：

编辑3：我添加了两次顶部、底部、前导和尾随约束，一次小于或等于（优先级1000），另一次大于或等于（优先级800），常量值为90。我不知道为什么底部它试图从主视图而不是容器视图（绿色视图）拉伸到90磅

---

**如果需要，您可以使用较低的优先级约束指定imageView的高度或宽度。

您有一个视图需要展开以填充其容器，同时保持其纵横比。这是自动布局的常见模式

诀窍是对前导/尾随/顶部/底部使用两个约束：

• =10

  低优先级

• =10

  ，具有所需的优先级

总而言之，您有：

• 纵横比1:1

• 在Superview中居中X/Y

• 前导/尾随/顶部/底部到Superview=10（优先级为750）

• 前导/尾随/上/下至Superview>=10（优先级为1000）

也有一些事情需要考虑：

• UIImageView将具有基于其显示的图像的固有内容大小，因此您需要确保其内容包含优先级低于您用于

  =10

  约束的750优先级

• UIImageView.contentMode

  确定基础图像相对于UIImageView大小的大小。默认情况下，它设置为

  UIViewContentModeScaleToFill

---

我成功地使用了此配置

我所做的是首先为中心X添加约束。（忽略中心Y，即使它在我的屏幕截图中。由于步骤2，它将中断。）

然后我添加了一个顶部和底部约束

最后，我添加了一个纵横比约束

当我对此设置动画时，长方体正确地缩放为正方形。如果你愿意，我可以上传测试项目

---

在代码中，用于realz。注意：奇怪的

CGFloat.greatestfinitemagnity

对于获取其他约束是必需的（或者更大的数字）。享受

extension UIView {
    func constrainAsSquare(container: UIView, multiplier: CGFloat) {
        translatesAutoresizingMaskIntoConstraints = false

        centerXAnchor.constraint(equalTo: container.centerXAnchor).isActive = true
        centerYAnchor.constraint(equalTo: container.centerYAnchor).isActive = true

        widthAnchor.constraint(equalToConstant: .greatestFiniteMagnitude).activate(with: .defaultLow)

        heightAnchor.constraint(lessThanOrEqualTo: container.heightAnchor, multiplier: multiplier).activate(with: .defaultHigh)
        widthAnchor.constraint(lessThanOrEqualTo: container.widthAnchor, multiplier: multiplier).activate(with: .defaultHigh)

        widthAnchor.constraint(equalTo: heightAnchor).activate(with: .required)
    }
}

extension NSLayoutConstraint {
    @discardableResult
    func activate(with priority: UILayoutPriority) -> NSLayoutConstraint {
        self.priority = priority
        isActive = true
        return self
    }
}

---

您应该对要保持方形的视图使用aspectRatio 1:1约束，然后仅包含其相对于父视图的高度或宽度，但不能同时包含两者。因此，只需将纵横比设置为1:1，并将高度或宽度设置为与superview成比例？这样做，我得到一个正方形（非常小），但它不会根据屏幕大小调整大小，在所有屏幕上都是相同的大小。你能告诉我你到底是如何设置约束的吗？我只是添加一个前导、尾随、底部和顶部约束，然后选择大于或等于，并将常量设置为10或如何设置？是的，就像你说的，然后将图像的纵横比添加为1:1（cntrl+拖动），将图像拖动到自身。这对我不起作用。我附上了一个截图，看看它是什么样子。你会如何用程序翻译这个@DannyBravoIt有效，但我有个问题。在4s上，正方形看起来太小了，我能控制它吗？在6和5s屏幕上，尺寸没有问题。@Adrian您可以在图像的superview上使用最小高度约束。例如：高度=超级视图。高度*0.5@优先级900，高度>=350@优先级1000@darren那很有效，谢谢。我必须引入1个新约束，比如Img.height=0.25 x superview。height@900当图像的大小从iPhone 6急剧增长到6 Plus时，按比例增加图像的大小x 0.25倍。如何将所有这些

前导/尾随/顶部/底部添加到Superview

？

extension UIView {
    func constrainAsSquare(container: UIView, multiplier: CGFloat) {
        translatesAutoresizingMaskIntoConstraints = false

        centerXAnchor.constraint(equalTo: container.centerXAnchor).isActive = true
        centerYAnchor.constraint(equalTo: container.centerYAnchor).isActive = true

        widthAnchor.constraint(equalToConstant: .greatestFiniteMagnitude).activate(with: .defaultLow)

        heightAnchor.constraint(lessThanOrEqualTo: container.heightAnchor, multiplier: multiplier).activate(with: .defaultHigh)
        widthAnchor.constraint(lessThanOrEqualTo: container.widthAnchor, multiplier: multiplier).activate(with: .defaultHigh)

        widthAnchor.constraint(equalTo: heightAnchor).activate(with: .required)
    }
}

extension NSLayoutConstraint {
    @discardableResult
    func activate(with priority: UILayoutPriority) -> NSLayoutConstraint {
        self.priority = priority
        isActive = true
        return self
    }
}